Membuat Tampilan Body HTML Web Sederhana

Seperti yang telah Saya tuliskan pada postingan pertama Membuat Tampilan Web Sederhana Menggunakan HTML kali ini Saya akan mengajak Anda untuk membahas tentang bagaimana membuat tampilan body pada halaman yang sudah dibuat sebelumnya. 

Struktur body sebuah website memang menjadi daya tarik sendiri bagi pengunjung web. Pertama sebelum kita membuat tampilan body sebaiknya kita tentukan dulu apa saja yang akan kita tampilkan di dalam body tersebut.

Misalnya kita memilih akan menampilkan isi utama dalam web dan beberapa widget. Kita akan membuat body menjadi dua kolom dengan ukuran lebar yang berbeda.

Untuk membagi kolom kita gunakan Tag <div> <table> ... </table> </div>. Tag Div merupakan bagian dari HTML 5 menurut saya menggunakan tag ini lebih mudah dan simple.

Struktur membuat 2 kolom pada body
  1. Pertama kita tuliskan Tag div tadi <body> di sini </body>, <div>..</div>
  2. Kedua kita juga menuliskan tag table <table>...</table> di dalam div
Untuk kode tersebut belum sempurna untuk membuat 2 kolom yang sudah kita rencanakan dari awal tadi. Untuk mengatur lebar kita dapat menyisipkan beberapa css di dalam tag div tersebut. 

Sebenarnya hal tersebut menurut saya kurang rapi, nanti pada kesempatan lainnya akan saya ajak untuk membahas hal tersebut hhehe.

Untuk sementara kita dapat menyisipkan kode css untuk mengatur lebar div sesuai dengan kebutuhan kita, kodenya kita tulis seperti ini <table style="width: 1264px;"> isi </table>, ukuran px bisa Anda buat sesuai dengan keinginan sendiri. Berikut kodenya jika kita telah menuliskan keseluruhan kodenya :



Berikut jika ditampilkan dalam browser :



Nah itu tampilannya, ngomong-ngomong sepertinya saya melewatkan headernya yah hehe. Postingan selanjutnya kita bahas tentang header ya ...Terima Kasih telah membaca gapunyakode...

0 Response to "Membuat Tampilan Body HTML Web Sederhana"

Post a Comment

Silahkan berkomentar Sob tapi untuk beberapa komentar yang tidak sesuai seperti link aktif dan hal-hal yang tidak baik tidak akan ditampilkan !. Terima kasih

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel