Assalamualaikum Wr.Wb
Pada kesempatan kali ini saya ingin mngajak teman - teman semua belajar tentang tag DIV.Oke,langsung saja kita mulai.DIV dapat digunakan untuk menempatkan beberapa elemet menjadi satu bagian.Div tidak memiliki arti khusus.DIV juga bisa di gunakan untuk menggantikan tabel saat ingin membuat sebuah layout untuk tampilan web
Dalam penggunaan tag DIV diperlukan atribut "id" untuk menandai elemen DIV yang satu dengan yang lainnya contohnya:
<div id="header"></div>
Selain itu DIV juga dapat di gabungkan dengan css
Pada kesempatan kali ini saya ingin mngajak teman - teman semua belajar tentang tag DIV.Oke,langsung saja kita mulai.DIV dapat digunakan untuk menempatkan beberapa elemet menjadi satu bagian.Div tidak memiliki arti khusus.DIV juga bisa di gunakan untuk menggantikan tabel saat ingin membuat sebuah layout untuk tampilan web
Dalam penggunaan tag DIV diperlukan atribut "id" untuk menandai elemen DIV yang satu dengan yang lainnya contohnya:
<div id="header"></div>
Selain itu DIV juga dapat di gabungkan dengan css
- Membuat header
<body>
<div id="halaman">
<div id="header" style="background: purple">
<h1 style="margin-bottom: 0; color: white;"><center>Bagian Header</center></h1>
</div>
</body>
Berikut SS coding
Berikut SS Hasilnya
- Membuat menu sederhana
<div id="menu" style="background-color: green; height: 500px;width:200px; float:left;">
<b>Menu</b><br><hr>
<a href="#">Home</a></br>
<a href="#">About</a></br>
<a href="#">Contact</a></br>
</div>
Berikut SS coding
Berikut SS Hasilnya
- Membuat bagian content/Isi
<div id="isi" style="background-color: yellow; width: 450px;height: 500px;float:left;">Ini isi</div>
untuk bagian isi silahkan di sesuaikan dengan kebutuhan,tinggal ubah lebar dan tinggi,dan juga bisa di tambah lagi DIV nya sesuai keinginan.
Satu lagi kalau ingin Merubah posisi DIV kita tinggal merubah"float:left/right"
untuk memindahkan posisi DIV ke kiri atau ke kanan.
untuk memindahkan posisi DIV ke kiri atau ke kanan.
Berikut SS Codingnya
Berikut Hasil coding di atas
- Membuat bagian Footer
<div id="footer" style="background-color:blue;clear:both;text-align:center;">
<font color="white">Bagian Footer</white></div>
Silahkan di modifikasi sendiri sesuai kebutuhan teman teman semua.
Berikut SS coding
Berikut SS hasilnya
Sedikit catatan semua tag DIV di atas bisa di modifikasi sesuai dengan keinginan teman - teman semua termasuk bagian isi atau content yang masih kosong bisa di tambah sesuai keinginan.Sekian dulu mengenai tentang DIV pada HTML,tentunya banyak kekurangan di postingan kali ini untuk itu saya mohon maaf atas kekurangannya.
Referensi:http://w3schools.com/
Referensi:http://w3schools.com/
Wassalamualaikum Wr.Wb
0 komentar:
Posting Komentar