sedikit tentang css bag 2

Sebelum membaca tutorial berikut, sebaiknya anda membaca ini sedikit tentang css bag 1
nah, jika sudah mari kita ke tutorialnya, langsung aja ya;

log in
tataletak/layouts
add a gadget/tambah gadget
copy script berikut;
<style type="text/css">
#belajarcss{width:300px;
background:#00ff00;
color:red;
border-top:2px solid #ffffff;
border-right:1px dotted #ffcc00;
border-bottom:2px solid #333333;
border-left:1px dotted #666666;
font-size:12px;
font-weight:bold;
font-face:arial;
text-align:center;
padding:5px 5px 5px 5px;}

</style>


<div id="belajarcss">belajar css sangatlah mudah, ya jika mau.! Apa anda ingin belajar css?</div>
simpan

setelah disimpan, coba anda edit sendiri cssnya, berikut keterangannya;

width adalah ukuran lebar/saya gunakan px
background adalah warna latar/ kode warna dapat anda lihat disini
color adalah warna/text
border adalah garis pinggir
font adalah pengaturan font/kedepannya akan saya bahas lebih jauh lagi
padding adalah pemberian batas/bahasa kasarnya(pemberian jarak antara border dan isi/text
align adalah peralatan/ left, center, righ, justifly

yang saya bahas diatas adalah struktur css jenis ID selector. Mengapa saya bahas ID SELECTOR? Jawabannya karena sangat banyak digunakan.
sedikit tentang ID SELECTOR;pada ID SELECTOR yang sangat perlu anda perhatikan adalah carakter # dan <div id="xxx"> yang saya tahu, penulisan ID SELECTOR setelah tanda #(pager) kalian bebas tulis apaan(kecuali spasi). Sedangkan <div id="xxx"> berfungsi untuk memanggil/mengaktifkan style css tadi.
contoh

#kalianbebastulisapaan{property:value; . . . . . . . . }

<div id="kalianbebastulisapaan"> biasanya berisi text, script dan code html lain </div>

perhatikan text merah/kedip, sedikit tambahan/untuk mengingatkan menurut w3.org penempatan style css Terletak antara/contoh;

<head>
<style type="text/css"> di sini tempat anda menulis style css </style>
</head>

namun untuk pengguna blogger, style cssnya cukup di tambahkan diantara
<b:skin> dan ]]></b:skin>
jika anda sudah paham mengenai css, coba kalian ke menu EDIT HTML kemudian cari style css yang diawali dengan #(#main, #sidebar, #foter, #header_wrapper dsb.)

Ditulis oleh intheamwhy pada Rabu, November 18, 2009

1 komentar:

Posting Komentar

Pengikut