Cascading Style Sheet atau CSS merupakan suatu bahasa yang digunakan untuk mendesain suatu tampilan dokumen HTML atau PHP dengan memisahkan isi dan kode penampilannya.
Ada 3 macam cara untuk memasukkan CSS kedalam dokumen, yaitu sbb:
- Dengan menambahkan style secara langsung dalam dokumen.
<p style="color:blue">Teks Warna Biru</p><div style="background:red">Background Red</div>
- Dengan meletakkan di dalam header dokumen. Misalnya:
<html><head><style type="text/css">p#green{ color:green; font-family:arial;}</style></head><body><p id="green">Paragraf dengan teks berwarna Hijau</p></body></html>
- Dengan membuat file CSS tersendiri yang tespisah dari dokumen html. Misalnya:
<html><head><link rel="stylesheet" href="/styles.css" type="text/css" /></head><body>Isi web</body></html>
Untuk saya pribadi, saya lebih suka cara yang kedua, karena loading halaman akan lebih ringan dan cepat. Namun secara umum, banyak yang lebih memilih cara ketiga untuk meletakkan CSS dihalaman web.
Dalam setiap aturan style CSS terbagi menjadi 3 bagian, yaitu:
- Selector
- Property
- Value
Syntax
selector{property: value}
Berikut ini adalah contoh paragraf dengan tag <p>:
p{color:blue;}Kode HTML
<p>Paragraf dengan teks berwarna biru</p>
Keterangan dari contoh diatas:
- Selector (<p>): Memberitahukan browser, tag HTML yang menggunakan style CSS tersebut.
- Property (color): Dalam HTML disebut sebagai atribut.
- Value (blue): Merupakan nilai yang menyatakan perubahan yang kita lakukan terhadap tampilan dari elemen.
Sekian, semoga bermanfaat.
0 comments:
Post a Comment