Dasar CSS ~ Anatomi CSS ~

ASSALAMU'ALAIKUM WR. WB.

A. PENDAHULUAN
    Selamat datang di blog saya. Kali ini saya akan membahas tentang anatomi CSS. Untuk lebih jelasnya simak baik-baik artikel saya kali ini.
B. LATAR BELAKANG
    CSS merupakan bagian dari web desain yang tak terpisahkan. Dengan CSS kita bisa merubah perwajahan (front-end) atau tampilan sebuah halaman web. Jika sebuah halaman web tidak menggunakan CSS, maka tampilannya akan membosankan dan tidak menarik.

C. MAKSUD DAN TUJUAN
    Agar tahu bagian-bagian utama dari CSS.

D. ALAT DAN BAHAN

• Laptop
• Text Editor

E. PEMBAHASAN

Bagian-bagian utama dari CSS ada 3 yaitu :

1. Selector
2. property
3. Value

1. SELECTOR

    Jika dalam HTML ada tag-tag yang menyusun sebuah dokumen HTML, maka dalam CSS juga dikenal dengan sebuah selector.
    Sebagai  bahasa yang digunakan untuk memberikan gaya dan tampilan, CSS menggunakan metoode deklaratif untuk menspesifikasikan bagian HTML ingin yang diberikan gaya tampilan. Pemilihan elemen HTML dilakukan dengan menspesifikasi selector. Berikut contoh kode dari sebuah selector <p> :
Format :
    p {
        . . . . .
}

Pada kode diatas, yang dikatakan selector ialah kode "p" atau :
    selector {
        . . . . .
}

Ciri-ciri :

• Nama-nama yang diberikan untuk style-style yang berbeda, baik itu style internal maupun eksternal
• Bagian elemen HTML yang akan ditunjukan untuk mengatur style.
• Dapat berupa Class dan ID

2. PROPERTY

    Sebuah property menentukan berbagai dessain yang dapat diubah dari sebuah elemen yang dipilih oleh selector. Contoh :
Format :
    p {
        color: . . . . ;
        font-size: . . . . ;
}

Pada kode diatas, yang dikatakan property ialah kode yang berada sebelum titik dua (":"). Kegunaan dari kedua property tersebut tentunya cukup jelas dari nama yang diberikan, yaitu color untuk memberikan warna pada elemen p, dan font-size untuk mengubah ukuran teks.

Ciri-ciri :

• Aturan dalam CSS untuk mengubah selector yang dipilih
• Property mempunyai nilai yang disebut degan value
• Property didalam tanda {}

3. VALUE
    Merupakan nilai dari property yang ingin kita berikan. Nilai yang dapat diberikan sendiri, tergantung dengan jenis propertynya.
    Misal, jika ingin memberikan nilai warna, kita harus memberikan nilai dalam dormat #RRGGBB (kombinasi nilai heksa Merah-Hijau-Biru yang biasa digunakan pada program pengolah grafis seperti photoshop).
    Ketika igin memberikan nilai ukuran kita dapat memberikan nilai dalam format nilai px atau nilai em. Contoh :
Format :
    p {
        color : #FF0000;
        font-size : 50px;
}

F. KESIMPULAN
    Dengan mengetahui itu kita dapat mengerti bagaimana cara memberikan/membuat program CSS.

G. REFERENSI
    Wikipedia

H. PENUTUP
    Sekian artikel dari saya, semoga bermanfaat dan terima kasih telah berkunjung di blog saya.

WASSALAMUALAIKUM WR. WB.