Pertemuan 4
Mengatur Tampilan Halaman Dengan CSS3
Web Statis
SKB112316Pengertian CSS
Merupakan standard pembuatan dan pemakaian style untuk dokumen terstruktur , guna mempersingkat penulisan tag HTML seperti font,color,text, dan table menjadi lebih ringkas sehingga tidak terjadi pengulangan tulisan.
Fakta Menggunakan CSS :
Telah didukung oleh kebanyakan browser versi terbaru, tetapi tidak didukung oleh browser-browser lama.
Lebih fleksibel dalam penempatan posisi layout
Menjaga HTML dalam penggunaan tag yang minimal
Terdapat 3 Cara Menginputkan CSS ke HTML :
Pengertian Selector, Property dan Value
Selector adalah elemen/tag HTML yang ingin diberi style.
5 Jenis Selector CSS
1. Universal Selector adalah sebuah pola (pattern) yang digunakan untuk ‘mencari’ suatu
tag di dalam HTML.
Contoh :
* {
color: blue;
background-color: white;}
}
2. Element Type Selector atau Tag Selector adalah istilah untuk selector yang nilainya adalah tag HTML itu sendiri.
Contoh :
h1 {
text-decoration: underline;
}
p {
font-size:14px;
3. Class Selector.
Class Selector akan ‘mencari’ seluruh tag yang memiliki atribut class dengan nilai yang
sesuai.
Implementasi pada HTML :
<p class=”paragraf_pertama”> Ini adalah sebuah paragraf pertama</p>
4. ID Selector
Penggunaannya mirip dengan class selector.
Contoh :
Implementasi pada HTML :
<p id=”paragraf_pembuka”> Ini adalah sebuah paragraf pembuka</p>
5. Attribute selector
Selector ini akan mencari seluruh tag yang memiliki atribut yang dituliskan.
Latihan Penggunaan Selector CSS
Buat Tag h2 berwarna biru :
h2 {
color: blue;
}
Buat Tag Strong berwarna merah :
strong {
color:red;
}