Cara Menciptakan Kotak Komentar Dengan Html Dan Css
Pada kesempatan kali ini Serba Tutorial Apapun akan mengasih turorial Cara Membuat Kotak Komentar dengan PHP. ditutorial ini aku memakai sebuah styntax html5 yaitu fieldset, cukup gampang dan rapih kalau memakai fieldset ini. JIka kalian belum tau apa itu fieldset? Oke aku akan kasih tau wacana fieldset sedikit.
fieldset diHTML yaitu untuk mengelompokan sebuah object atau form dan juga untuk mempercantik sebuah form.
Tanpa Basa Basi Serba Tutorial Apapun akan kasih tutorialnya, Pertama jalankan/run text-editor yang gunakan, kemudian ketiklah/copy script HTML ibarat dibawah ini :
<div class="container">
<fieldset>
<legend>Komentar</legend>
<div class="kotak">
<span>Muhammad Fajar</span>:<br><hr>
<p> Makasih Kak Atas Tutorialnya :) </p>
</div>
<div class="kotak">
<span>Kefin Dwi Saputra</span>:<br><hr>
<p> Wah Sangat Membantu Lanjutkan Gan :D </p>
</div>
</fieldset>
</div>
Jika sudah dengan HTMLnya, Langkah selanjutnya kalian tambahkan script style
script style CSSnya ibarat dibawah ini :
<style>
*{margin:0; padding: 0}
.container{width: 800px; margin: auto;}
fieldset{width: 400px; padding: 10px;}
.kotak{border: 1px solid grey; padding: 5px; margin:5px 0; overflow: hidden;}
</style>
Dan hasil dari kedua script diatas akan menjadi ibarat dibawah ini :
<html>
<head>
<meta charset="UTF-8">
<title>Kotak Komentar</title>
<style>
*{margin:0; padding: 0}
.container{width: 800px; margin: auto;}
fieldset{width: 400px; padding: 10px;}
.kotak{border: 1px solid grey; padding: 5px; margin:5px 0; overflow: hidden;}
</style>
</head>
<body>
<div class="container">
<fieldset>
<legend>Komentar</legend>
<div class="kotak">
<span>Muhammad Fajar</span>:<br><hr>
<p> Makasih Kak Atas Tutorialnya :) </p>
</div>
<div class="kotak">
<span>Kefin Dwi Saputra</span>:<br><hr>
<p> Wah Sangat Membantu Lanjutkan Gan :D </p>
</div>
</fieldset>
</div>
</body>
</html>
Jika sudah ibarat diatas maka kemudian kalian simpan, dan coba kalian jalankan/run
dibrowser yang kalian gunakan.Dan kalau berhasil akan ibarat dibawah ini:
Cukup gampang ya? Makara pola sederhananya kurang lebih ibarat itu dalam membuat
kotak komentar.
Oke kalau begitu cukup sekian pembahasan kali ini wacana Cara Membuat Kotak Komentar dengan HTML dan CSS. kurang lebih nya mohon maaf dan biar bermanfaat.
Demikian tutorial wacana Cara Membuat Kotak Komentar dengan HTML dan CSS.
Semoga bermanfaat bagi kalian jangan lupa untuk menge-share tutorial ini bila kalian merasa terbantu..
Terima kasih
Sumber http://serba-tutorial-apapun.blogspot.com
fieldset diHTML yaitu untuk mengelompokan sebuah object atau form dan juga untuk mempercantik sebuah form.
Tanpa Basa Basi Serba Tutorial Apapun akan kasih tutorialnya, Pertama jalankan/run text-editor yang gunakan, kemudian ketiklah/copy script HTML ibarat dibawah ini :
<div class="container">
<fieldset>
<legend>Komentar</legend>
<div class="kotak">
<span>Muhammad Fajar</span>:<br><hr>
<p> Makasih Kak Atas Tutorialnya :) </p>
</div>
<div class="kotak">
<span>Kefin Dwi Saputra</span>:<br><hr>
<p> Wah Sangat Membantu Lanjutkan Gan :D </p>
</div>
</fieldset>
</div>
Jika sudah dengan HTMLnya, Langkah selanjutnya kalian tambahkan script style
script style CSSnya ibarat dibawah ini :
<style>
*{margin:0; padding: 0}
.container{width: 800px; margin: auto;}
fieldset{width: 400px; padding: 10px;}
.kotak{border: 1px solid grey; padding: 5px; margin:5px 0; overflow: hidden;}
</style>
Dan hasil dari kedua script diatas akan menjadi ibarat dibawah ini :
<html>
<head>
<meta charset="UTF-8">
<title>Kotak Komentar</title>
<style>
*{margin:0; padding: 0}
.container{width: 800px; margin: auto;}
fieldset{width: 400px; padding: 10px;}
.kotak{border: 1px solid grey; padding: 5px; margin:5px 0; overflow: hidden;}
</style>
</head>
<body>
<div class="container">
<fieldset>
<legend>Komentar</legend>
<div class="kotak">
<span>Muhammad Fajar</span>:<br><hr>
<p> Makasih Kak Atas Tutorialnya :) </p>
</div>
<div class="kotak">
<span>Kefin Dwi Saputra</span>:<br><hr>
<p> Wah Sangat Membantu Lanjutkan Gan :D </p>
</div>
</fieldset>
</div>
</body>
</html>
Jika sudah ibarat diatas maka kemudian kalian simpan, dan coba kalian jalankan/run
dibrowser yang kalian gunakan.Dan kalau berhasil akan ibarat dibawah ini:
Cukup gampang ya? Makara pola sederhananya kurang lebih ibarat itu dalam membuat
kotak komentar.
Oke kalau begitu cukup sekian pembahasan kali ini wacana Cara Membuat Kotak Komentar dengan HTML dan CSS. kurang lebih nya mohon maaf dan biar bermanfaat.
Demikian tutorial wacana Cara Membuat Kotak Komentar dengan HTML dan CSS.
Semoga bermanfaat bagi kalian jangan lupa untuk menge-share tutorial ini bila kalian merasa terbantu..
Terima kasih
Sumber http://serba-tutorial-apapun.blogspot.com
0 Response to "Cara Menciptakan Kotak Komentar Dengan Html Dan Css"
Posting Komentar