Dasar-dasar CSS 1

Untuk mempercantik template, kita harus berurusan dengan yang namanya kode CSS. Tapi, banyak pemula masih bingung dengan kode CSS. Nah, untuk itu saya berikan dasar-dasarnya dulu. Dasar-dasar CSS ini akan diterbitkan secara berurutan dan nantinya akan muncul secara berseri. Sebelum belajar CSS, anda perlu mengetahui dulu tentang HTML dan diharapkan membaca dulu dasar-dasar kode HTML bagian 1, bagian 2,bagian 3, dan bagian 4. Untuk permulaan, saya bertanya. Apa sih yang namanya CSS itu?


CSS adalah singkatan dari Cascading Style Sheet. Bisa digunakan untuk menentukan style dari situs web, misalnya layout, warna, latar belakang, dan lain-lain. Cara penulisan kode CSS seperti ini.

selector{properti:nilai;}

Selector adalah "nama" dari kode CSS (bingung nyebutnya apa jadi anggap aja begitu...). Properti adalah sifat-sifat dari selector. Sedangkan nilai adalah nilai dari properti. Misalnya:

body{color:#FFFFFF;}

Artinya: selector body akan mempunyai sifat warna teks yang berwarna putih.



Lalu ada juga yang namanya komentar. Komentar diawali dengan kode /*dan diakhiri dengan kode */. Panjangnya boleh satu atau beberapa baris. Kode CSS yang ditaruh diantara kedua kode tersebut tidak akan diproses oleh browser. Contoh:

/* Ini contoh komentar pada CSS

bisa satu baris atau lebih. */

body{/* ini adalah nama selector */

color:white; /* artinya selector body akan bersifat warna teks putih */

}

CSS bisa dimasukkan pada situs web dengan beberapa cara.



1. Dengan kode

2. Dengan kode style="..." (inline style).

Contoh:

Bagian ini akan berlatar belakang warna hitam.

Anda bisa saja menggunakannya pada elemen selain div. Yang penting, kode CSS-nya ditaruh diantara kode style="...".

3. Dengan metode impor style.

Kodenya seperti berikut.

Kode tersebut ditaruh diantara kode  dan kode . Yang penting ganti bagian URLFILECSS dengan URL dari file CSS yang anda simpan di web hosting.

Untuk kali ini segitu dulu. Kapan-kapan dilanjutkan dengan pembahasan tentang selector. Terima kasih dan silakan komentar untuk kemajuan blog ini. Terima kasih.

Share on FacebookPlus on Google+

SUBSCRIBE TO OUR NEWSLETTER