Senin, 04 Oktober 2010

CSS1:Merancangnya ke dalam css dan html part1

Masuk kedalam rancangan css dan html. sebelum masuk ke dalam pembuatan script css dan html, kita logika dulu dari design template yang ada sebelumnya.

didalam rancangan tersebut terdapat bagian head,body, dan footer. dengan melihat bagian kita logika lagi apa-apa saja yang terdapat dalam bagian tersebut. dalam head terdapat link,logo, serching dan gambar. dalam body terdapat link-link dan content articel. dalam footer terdapat texs created. itulah analisis yang di dapat dari melihat dari sebuah design templete.
sekarang kita mulia menulis script css dan html menggunakan text editor. saya di sini menggunakan macromedia dreamweaver.
buka aplikasi dreamweaver. pilih new document css. akan tampil seperti berikut.dan new document html.



pertama kita buat terlebih dahulu script css nya sebagai berikut.


(untuk lebih jelasnya click gambar)

dan di dalam document html ketikkan script berikut


(untuk lebih jelasnya click gambar)

untuk melihat hasilnya simpan terlebih dahulu ke dua file tersebut di dalm sebuah folder. saya menyimpannya di dalam folder dengan nama matakai sesuai dengan nama design template. untuk file css simpan dengan nama style.css, sedangkan file html simpan dengan nama index.html. setelah tersimpan kita akan mencoba melihat hasilnya. cari file html yang tersimpan dan 2x klik akan terlihat seperti ini.



sekaranga akan saya jelaskan sesuai kemampuan saya. :p
di dalam file css adalah properti untuk mengatur tampilan index html yang pembagiannya sudah di buat di dalam document index. misalnya pada script document index
ngetesss kolomm
diatur di dalam css dengan script css #kolom1{
background-color:#0a8dab;
float:left;
height:auto;
width:1000px;
}
properti tersebut artinya memiliki warna beckground biru tua dengan kode #0a8dab, float adalah tata letak menempel ke kiri, height atau tinggi memanjang automatis kebawah mengikuti banyaknya content, weidth adalah lebar dengan panjang 1000 pixel.

sebelum terlupakan ada yang terpenting di dalam document index, script berikut
link href="style.css" rel="stylesheet" type="text/css"
script tersebut adalah script pemanggilan css. di dalam script terdapat link href="style.css", style.css tersebut disesuaikan terhadap nama css yang anda simpan.


lanjut tutor...........click

Tidak ada komentar:

Posting Komentar