Oleh kareelkun, 18 February DMCA.com Protection Status
CSS singkatan dari Cascading Style Sheets digunakan untuk mempercantik halaman website, termasuk desain, tata letak, dan variasi tampilan untuk berbagai perangkat dan layar. Dengan CSS kita bisa memanipulasi tampilan website, seperti mengubah desain dari sebuah text, warna, gambar dan latar belakang / background dari semua tag HTML, sehingga website yang kita buat akan terlihat lebih hidup.

A. Sintaks Dasar CSS

Sintaks dasar CSS memiliki 2 bagian utama yaitu Selector dan satu atau lebih Declaration. Penulisan sebagai berikut ini:
selector {
    properti_1:nilai_1;
    properti_2:nilai_2;
    properti_a:nilai_a;
    properti_z:nilai_z;
}
Keterangan :
  • Selector mengarah ke elemen HTML yang akan dimanipulasi "selector"
  • Sebuah Declaration harus berada di dalam tanda kurung kurawal "properti_1"
  • Declaration berisi satu atau lebih yang dipisahkan oleh titik koma ";"
  • Deklarasi CSS selalu diakhiri dengan titik koma, dan setiap deklarasi berisi nama properti dan nilai value "properti_1:nilai_1;"
Contoh penulisan CSS untuk selector element <body></bod> sebagi berikut ini:
body {
    background:#ffffff;
    color:#000000;
    border:1px solid #000000;
}
dari css diatas maka akan tampil di element body latar warna putih "#ffffff" tulisan teks warna hitam "#000000" dan tebal border garis full 1 px warna hitam

B. Jenis-Jenis Selector Pada CSS

Selector pada CSS terbagi menjadi 3 jenis yaitu Selector Element, Selector Id dan Selector Class. Dibawah ini contoh-contoh dari masing jenis selector.
  • Selector Element
Yang di maksud Selector Element itu adalah element kontent pada sebuah HTML mulai dari <body> sampai penutup </body>. Sebagai contoh akan mewarnai latar belakang warna merah pada element DIV:
div {
    background:#ff0000;
}
  • Selector Id
Selector Id ini sering dijumpai pada atribut sebuah element. Sebagai contoh Selector id pada element DIV berikut ini:
div#nama_ID {
    background:#ff0000;
}
maka akan berefek pada element DIV dengan nama selector id, atau sebagi contoh selector id akan berefek di semua element html penulisan seperti ini
#nama_ID {
    background:#ff0000;
}
    • Selector Class 
    Selector class sama seperti selector id sering dijumpai pada atribut element misalnya <div class='nama_class'></div>. Berikut  ini penulisan CSS untuk selector class
    .nama_class {
        background:#ff0000;
    }
    Newer Posts Newer Posts Older Posts Older Posts

    Artikel Lainnya

    Iklan Atas Artikel

    Iklan Tengah Artikel 1

    Iklan Tengah Artikel 2

    Iklan Bawah Artikel

    Disable AdBlock

    Untuk mengakses Kareel Blog, nonaktifkan atau disable AdBlock di dalam pengaturan extension browser.