Membangun template sederhana (DIV)

Sebelum masuk ke DIV, mari ingat pada script terdahulu

HEADER
Menu	Content web
Footer

disini kita melihat struktur dari DIV
apabila kita ingin membuat menjadi bentuk div, minimal yang akan kita buat seperti ini

<div class='mainbody'>

<div class='header'></div header>

</div>

<div class='mainbody'>

<div class='mid'>

<div class='midleft'></div><div class='midright'></div>

</div mid>

</div>

<div class='mainbody'>

<div class='footer'></div footer>

</div>

kira-kira hasilnya seperti dibawah:

header

Kiri

content

footer

Secara garis besar sama seperti di atas, hal yang merepotkan tentu saja karena saya membagi htmlnya dalam 3 bagian besar lalu dibuat ke versi yang lebih minor yaitu:

•  Header
• mid
• footer

untuk design skala kecil, hal ini akan terlihat sebagai sebuah pemborosan, tetapi bila skalanya besar, dimana bagian mid akan ada banyak  pengulangan perintah, maka tampilan ini sangat disarankan!

Selain masalah tampilannya yang mirip seperti table, ada hal yang perlu dipertimbangkan yaitu tampilannya di browser berbeda. Pada tampilan table di tutorial berikutnya, tampilan di firefox (dimana kita membuat webnya) akan bagus, demikian juga di Chrome. Tetapi ketika masuk Opera, tampilan itu akan rusak. Hal sama mungkin dapat terjadi di IE.
Tetapi pemakaian DIV ini bisa dibilang adalah pemakaian terbaik karena tampilannya tidak akan berubah. Apabila berubah kita dapat membuat lagi dengan tidak merusak struktur HTMLnya (bukan css)