Properti CSS : Part 1

Assalamualaikum Wr.Wb
Kali Ini saya akan menjelaskan tentang beberapa komponen CSS. Sebelumnya saya sudah menjelaskan sedikit apa itu CSS, sekarang saya berbagi ilmu tentang Propertinya.

1. CSS Color

Color di CSS biasanya dideklarasikan dengan nama valid seperti blue, red, dan lain lain. Bisa juga bisa dideklarasikan dengan rgb dan angka hexadecimal. CSS mendukung 140 warna standar. Untuk sistem rgb, setiap parameter, didefinisikan dari 0 sampai 255. Untuk menggunkan hexadecmal, maka akan didefinisikan angka hexadecimal #0 sampai F.

• Standard color

• RBG

• Hexadecimal Color

2. CSS Background
Digunakan agar background sebuah body, navigator, atau form memiliki latar belakang yang sesuai dengan keinginan kita. Properti di Background ada :

• background-color
• background-image
• background-repeat
• background-attachment
• background-position
• background-size

Background-color digunakan agar background suatu elemen didasari dengan warna saja.
Background-image digunakan agar background suatu elemen didasari dengan image atau gambar.
Backgorund-repeat digunakan agar backround posisinya landscape atau potrait.
Background-attachment digunakan untuk menentukan lebar atau ukuran dari suatu gambar bisa fit dengan layar atau menurut containt website.
Background-position digunakan untuk mengatur posisi apakah fixed atau yang lain.
Background-size digunakan untuk mrngatir ukuran dari sebuah backgorund

3. CSS Borders
Digunakan untuk memberikan batasan berupa garis yang bisa diwarnai sesuai dengan selera kita dan bisa diatur ketebalan atau di atur daerah mana yang akan dikasih batas.
 Gaya perbatasan atau (border-style) properti digunakan untuk menentukan jenis perbatasan apa yang akan ditampilkan. Nilai nilai yang diizinkan pada properti ini.

• dotted - Batasnya berupa titik titik
• dashed - Batasnya berupa garis putus putus
• solid - batasnya solid atau gari biasa
• double - batasnya akan digandakan
• groove- batasnya berlekuk 3D efeknya tergantung pada nilai border-color
• ridge - batasnya bergerigi 3D efeknya tergantung pada nilai border-color
• inset - batasnya dibagian dalam 3D. Efeknya tergantung pada nilai border-color
• outset - batasnya dibagian luar 3D. Efeknya tergantung pada nilai border-color
• none - tidak ada batasnya
• hidden - adabatasnya namun tersembunyi

Properti ini juga mendefinisikan lebar perbatasan dengan border-width  dapat diatur dengan ukuran tertentu dengan satuan ( px,pt, cm, em dll.)
Ada juga untuk mengatur warna dari border yaitu border-color  bisa menggunakan format warna standard, rgb atau pun hexadecimal color.
Ada juga border radius yang yang membuat perbatasan menjadi bulat atau agak melengkung. Tergantung nilai radius yang kita inginkan.
Sebenarnya banyak properti untuk borders, namun yang laiin ini merupakan adaptasi dari properti yang diatas.



Sekian dan Terima Kasih
Wassalamualaikum Wr.Wb.

Referensi :
W3Schools CSS