Buka dreamweaver anda pada desktop, lalu pilih menu HTML
untuk membuat CSS pada web anda menggunakan dreamweaver. Setelah anda membuat
lembaran baru pada dreamweaver, klik split untuk membuat website anda, split
adalah menu yang menampilkan code html dan design html website anda yang akan
anda buat.
Langkah-langkahnya :
- Sebelumnya letakkan kursor anda setelah bagian <body> Klik menu insert > pilih menu layout object > insert DIV untuk membuat menu CSS anda yang pertama pada website anda.
- Setelah itu akan muncul tampilan insert div tag , anda hanya mengisi kotak ID dengan ID yang telah anda tentukan. Pada pembahasan ini, saya memakai ID container untuk CSS pertama saya.
- Lalu klik New CSS Rule, maka akan muncul layar tampilan new CSS rule anda secara detail > klik OK dan anda akan pergi ke CSS Rule definition for #container, pada menu tersebut anda akan diminta untuk mengisi positioning dengan width dengan 1000 atau sesuai keinginan anda dan positionnya adalah static, jika anda ingin mengisi menu lainnya, anda tinggal mengisi data-data tersebut sesuai website yang anda inginkan. Lalu Ok dan akan tampilan kemenu utama yaitu menu New CSS Rule > Ok, dan akan muncul gambar seperti ini
- Kemudian membuat sidebar caranya sama dengan langkah sebelumnya, hanya pada sidebar anda diminta untuk mengisi box dengan width 250, height adalah 400 dan floatnya adalah left, dan positioningnya dengan width dan heightnya sama dengan box serta positionnya adalah static
- Setelah itu akan muncul CSS anda yang pertama pada split anda, untuk langkah berikutnya yaitu membuat header pada website anda, letakkan kursor anda pada tulisan Content for id “container” Goes Here. Caranya masih sama dengan membuat menu CSS #container, positionnya static dan widthnya adalah 1000 atau sesuai dengan keinginan anda.
- Sebelum memulai langkah terakhir letakkan kursor anda pada </div> dan buat content dengan cara yang sama seperti cara sebelumnya, hanya pada bagian content isi box dengan width adalah 750 dan heightnya adalah 400, serta pointingnya dengan width dan heightnya sama seperti box dan positionnya adalah static. Setelah semua selesai anda berikan warna pada setiap bagian CSS anda dengan klik page properties > background (sesuai selera).
- Pada bagian sidebar ketikkan keyword Home,Blog dan About untuk membuat website anda, kemudian jangan lupa untuk me-link Home ,Blog dan About anda pada bagian kotak link, maka akan muncul gambar seperti dibawah ini
- Setelah itu ketikkan kata-kata pada bagian content untuk halaman home anda, seperti “Welcome to WenLife” dan akan muncul gambar sepeti dibawah ini
- Save halaman pertama anda dengan nama home.html, setelah itu drag atau copy code pada halaman pertama anda dan buat file baru kemudian copy-paste code html pada halaman home anda tadi untuk membuat halaman blog anda.
- Ganti kata-kata pada bagian blog anda dengan isi yang sesuai dengan design website anda, pada pembahasan ini saya mengisi blog saya dengan lirik lagu, dan akan muncul gambar seperti dibawah
- Kemudian save halaman kedua anda dengan nama blog.html, selanjutnya copy-paste kembali code html pada blog anda untuk membuat halaman about anda. Buat file baru dan copy-paste html pada blog, dan isikan about anda sesuai keinginan anda, pada pembahasan ini saya mengisi about saya dengan biodata saya, dan akan muncul gambar sepeti dibawah ini
- Save kembali halaman design website anda dengan nama about.html, setelah semua design selesai dibuat dan disave dalam satu folder yang sebelumnya anda buat, jalan design website anda pada search engine seperti pada google chorme.Klik satu persatu link tersebut apakah jalan atau tidak, jika jalan akan muncul tampilan seperti
