Css
Css
• CSS hanya membutuhkan style sebagai penentu dari font, warna, dan format‐format lain u
ntuk memformat atribut sebuah halaman web yang dibuat.Tiap style mempunyai 2
elemen dasar, yaitu “selector” dan “declarator”.
• Selector merupakan tag HTML atau tag yang dinamai sendiri oleh designer, sedangkan
declarator adalah atribut/perintah CSS yang menunjukkan tipe bentuk yang diaplikasikan
pada selector. Declarator berada di dalam tanda kurung kurawal “{}”.
• Terdapat 2 jenis selector, yaitu ID dan CLASS ‐
Selector ID (diawalai tanda #)digunakan untuk menentukan style bagian unik dari HTML,
artinya satu nama ID hanya bisa digunakan satu kali pada sebuah halaman web. ‐
Selector CLASS (diawali tanda . )digunakan untuk menentukan style dari sebuah group
elemen, bisa dipakai berulangkali pada sebuah dokumen web.Artinya sebuah nama class
dapat dipanggil beberapa kali pada elemen‐elemen yang ada pada sebuah halaman
web.
• Selector dan declarator yang sudah dibuat dalam CSS kemudian dipanggil ke dalam HTML
agar layout yang dibuat diterapkan pada isi dalam dokumen HTML. Selector ID dan Class
memiliki pemanggilan yang berbeda
PEWARISAN (INHERITANCE)
• Inheritance dalam CSS adalah sifat penurunan efek CSS dari sebuah tag HTML kepada tag
HTML lainnya. Syarat untuk inheritance adalah: tag tersebut harus berada di dalam tag
lainnya. Di dalam HTML, setiap tag umumnya akan berada di dalam tag lain. Untuk
seluruh tag HTML, akan berada di dalam tag <html>, dan untuk seluruh tag yang tampil di
web browser akan berada di dalam tag <body>.
Dari contoh diatas, tag <p> berada di dalam tag <div>, sehingga dapat dikatakan tag <div> adalah ind
uk (parent) dari tag <p>. Sedangkan tag <b> yang berada di dalam tag <p> merupakan anak (child)
dari tag <p> dan grandchild dari tag <div>.
Maka efek dari kode CSS tersebut akan membuat seluruh text di dalam tag <div> akan berwarna
hijau, walapun di dalam tag <div> juga terdapat tag‐tag lainnya. Dapat dikatakan bahwa efek CSS
tersebut diturunkan (inherit) dari tag induk <div> kepada tag anak <p> dan <b>.
PENEMPATAN CSS DALAM HTML
• Menempatkan style CSS dalam dokumen HTML dapat dilakukan dalam beberapa cara :
• Inline Style Style CSS dibuat dalam sebuah tag HTML yang hanya berlaku untuk dokumen
yang diapitnya saja.
• Style CSS diletakkan di dalam dokumen HTML, terletak di antara tag <head> dan </head
>.Aturan‐aturan dalam style diatur sedemikian rupa untuk digunakan pada suatu tempat
maupun untuk keseluruhan situs.
• Style CSS dibuat terpisah/diluar dokumen HTML dengan ekstensi .css, kemudian di
panggil oleh dokumen HTML menggunakan perintah “link rel”.
LATIHAN
• <html>
• <head>
• </head>
• <body>
• <font style='font-family:arial; font-size:20px; background-color:skyblue'> Inline Style dalam CSS
• </font>
• </body>
• </html>