Cara Penulisan Value Dari Properti Css (Cascading Stylesheet)

Assalamualaikum Warahmatullahi Wabarakatu
Bismillahirrahmanirrahiim

Pada postingan kali ini saya akan menjelasakan lebih lanjut tentang aturan penulisan value dari properti yang ada di css. Terdapat beberapa jenis value yang dapat berikan pada properti style, antara lain berupa predefined value, bilangan, prosentase, url, dan juga warna.

Predefined Value
Predefined value merupakan nilai yang sudah terdefinisikan oleh (X)HTML. Nilai ini dapat dipilih dari beberapa alternatif pilihan yang ada. Contoh penggunaan predefined value ini adalah pada style berikut

h1{
   font-style : bold;
}

Style di atas digunakan untuk membuat text miring pada elemen heading 1. Dalam hal ini value 'bold' merupakan predefined value. Untuk properti font-style terdapat pilihan value yang telah didefinisikan oleh (X)HTML yaitu bikd, normal,italic dan oblique. Perhatikan bahwa predefined value ditulis tanpa diapit tanda petik.

Bilangan
Suatu value dapat pula berupa bilangan tertentu (tanpa satuan apapun). Berikut ini contohnya:

P {
   line-height : 2;
}

Maksud style di atas adalah mengatur jarak antar baris paragraf menjadi 2 kali dari ukuran fontnya.

Panjang, Besar dan Persentase
Untuk menyatakan panjang, besar dan prosentase, value harus diberikan satuan seperti px (pixel), in (inch), cm (centimeter), mm (milimeter), pt (points) dan pc (picas). Berikut ini beberapa contohnya

hr {
    /* membuat ukuran font 20 pixel */
    font-size : 20px; 
    /* membuat garis horizontal dengan panjang 20% terhadap lebar jendela browser /*
    width : 20%; 
}

URL
Sebuah value juga dapat berupa URL. Berikut ini contohnya

body{
  background : url(img/image.jpg);
}

Style di atas untuk memberi background image pada body yang diambil dari folder img dengan nama file image.jpg, jika gambar berada pada folder sebelumnya maka sobat bisa menambahkan tanda ../ untuk memanggil folder sebelumnya, contohnya

body{
   background : url(../assets/img/image.jpg);
}

Style diatas untuk memberi background image pada body yang diambil dari folder assets yang berada diluar folder tempat css berada, artinya folder gambar tidak satu folder dengan style css.

Warna
Untuk memberi value berupa warna pada properti, ada beberapa cara yang dapat dilakukan yaitu dengan menuliskan secara eksplisit warna yang diinginkan, misal (red, green, yellow, dll) atau dengan menuliskannya dalam kode hexadesimal. Berikut ini contohnya

p{
    color : red;
}
p{
      /* identik dengan warna merah (hexadesimal)
     color : #FF0000; 
}

Style diatas untuk memberi warna merah pada semua element p

sampai disini dulu tutorial dari saya mengenai Cara Penulisan Value Dari Properti Css (Cascading Stylesheet), Semoga tutorial ini bermanfaat bagi sobat, atas segala kekuranganya mohon dimaafkan dan di beri saran, untuk tutorial selanjutnya adalah membuat Css Eksternal.