CSS merupakan
salah satu dokumen
website yang bertujuan
untukmengatur gaya (style) tampilan website.
Beberapa
manfaat dari penggunaan CSS
- Kode HTML menjadi lebih sederhana dan lebih mudah
diatur.
- Ukuran file menjadi lebih kecil sehingga load file
lebih cepat.
- Mudah untuk mengubah tampilan, hanya dengan mengubah
file CSS
- Dapat digunakan dalam hampir semua jenis web browser.
CSS 3 merupakan versi CSS terbaru yang masih dikembangkan olehW3C dan CSS
2 didukung seutuhnya
oleh CSS 3
dan tidak adaperubahan
Anatomi CSS
terbagi ke dalam tiga bagian yaitu: selector, property, danvalue.Selector{ Property : value; }
Cara kerja CSS
dimulai saat deklarasi style yang diinginkan dengan
menulis style
(selektor, id dan class)
Format
penulisan CSS dengan Selector HTML adalah Nama-elemen
Format
penulisan CSS dengan Selector class adalah .nama-class { … }
Format
penulisan CSS dengan Selector id adalah #id { … }
Penerapan CSS
pada sebuah halaman web dapat dilakukan dengan
beberapa
alternatif di antaranya adalah: inline style sheet, embeddedstyle sheet, external style sheet
Agar lebih
menarik, mudah dalam hal pengaturans serta editing, teks pada sebuah halaman
web dapat diberikan sytle dalam kemasan CSS.
Pengaturan
style tersebut meliputi banyak properti, diantaranya color, direction,
letter-spacing,line-height, text-align,text-decoration, textindent,
text-shadow, text-transform, unicode-bidi, vertical-align,whitespace,
word-spacing
Format
penulisan untuk pemberian warna pada text menggunakan CSS adalah sebagai
berikut : selector {color:nilai warna}
Format
penulisan CSS untuk pengaturan jarak (spasi) antar karakter atau huruf adalah
sebagai berikut selector { letter-spacing:nilai spasi;}
Format
penulisan CSS untuk mengaturan dekorasi teks adalah sebagai berikut selector
{text-decoration : nilai text-decoration}
Format
penulisan CSS untuk pengaturan jarak (spasi) antar karakter atau huruf adalah
sebagai berikut selector { word-spacing:nilai spasi;} Pemrograman Web
Format
penulisan untuk pengaturan jarak indentasi text adalah sebagai berikut selector
{ text-indent:nilai indent}
. Format
penulisan CSS untuk pengaturan text indent adalah sebagai berikut selector {
text-transform:nilai text transform}
format
penulisan CSS dengan text-shadow adalah Selector {text-shadow: koordinatX koordinatY
nilaiWarnaTeksBayangan
Format
penulisan CSS untuk text alignment selector {text-align:nilai textalign;}
CSS berperan
penting dalam menyajikan
informasi dengan visual
yang lebih baik, lebih
optimal dari sisi
penulisan serta lebih
disenangi oleh mesin pencari.
Untuk mengatur
format multimedia dapat dituliskan secara inline, embed maupun eksternal CSS.
Pemberian
style pada gambar dapat menggunakan selector <img>
Pemberian
style pada video dapat menggunakan selector <video>
Penambahan
gambar sebagai latar belakang menggunakan dua properti, yaitu property
background image dengan menggunakan tag div seperti format berikut div {
background-image: url(“latar.png”); }
Pada dasarnya
elemen dari HTML adalah model box yang mempunyai properti margin,border,padding dan
content hal ini
dapat digunakan untuk mendesain
tampilan dari tabel.
CSS dapat
digunakan untuk memformat
border atau garis
tepi dari sebuah tabel.
penerapan style
border pada tabel
dengan style sebagai
berikut {border:1px solid black;}
Lebar dan
tinggi dari sebuah
tabel didefinisikan dalam
property width dan height.
Teks dalam tabel
diatur dengan properti.text-align dan
vertical- align .
Nilai dari properti text-align untuk horizontal
alignment adalah left, right, atau center.
Nilai dari
properti text-align untuk
horizontal alignment adalah
top, bottom, or middle
Padding adalah
jarak antara isi
atau content, berupa
teks ataupun gambar dengan batas
dalam dari atau elemen HTML <td>.
Pewarnaan pada
tabel dapat digunakan
untuk mengatur warna
pada teks,background maupun border
Style warna
akan memberikan efek warna pada tag table,data (td) dan header tabel (th).
