Mengenal Apa Itu Property dan Value dalam CSS Declaration (Deklarasi)

0
Mengenal Apa Itu Property dan Value dalam CSS Declaration (Deklarasi)
Mengenal Apa Itu Property dan Value dalam CSS Declaration (Deklarasi)

Apa itu Property dan Value dalam CSS Declaration atau Deklarasi CSS? Ya. Aturan CSS terdiri dari dua bagian yang berbeda Selector dan Declaration. Selector menentukan apa yang sedang ditata pada halaman dan Declaration (Deklarasi) adalah bagaimana sesuatunya seharusnya ditata. Sebagai contoh:

p {
color: # 000;
}

Ini adalah aturan CSS. Bagian pemilih adalah “p”, yang merupakan pemilih/penyeleksi elemen untuk “paragraf”. Karena itu, ia akan memilih SEMUA paragraf di situs Website dan memberikan gaya ini (kecuali ada paragraf yang ditargetkan oleh gaya yang lebih spesifik di tempat lain dalam dokumen CSS Anda).

Declaration (Deklarasi) dalam CSS

Di dalam CSS Declaration ada Property dan Value, Bagian dari aturan yang mengatakan “color: #000;” adalah apa yang dikenal sebagai Declaration (deklarasi). Declaration (Deklarasi) terdiri dari dua bagian properti dan nilainya.

a. Property (Properti)

Properti adalah bagian “warna” dari deklarasi ini. Ini menentukan aspek pemilih mana yang akan diubah secara visual.

b. Value (Nilai)

Nilainya (value) adalah bagaimana properti CSS yang dipilih tersebut akan diubah. Dalam contoh kami, kami menggunakan nilai hex #000, yang merupakan singkatan CSS untuk “hitam”.

Jadi ketika menggunakan aturan CSS ini, halaman kami akan memiliki paragraf yang ditampilkan dalam font-warna hitam.

CSS Property (Properti)

Agar lebih memahami mengenai Property dan Value dalam CSS Declaration, Ketika Anda menulis CSS Property (Properti), Anda tidak bisa membuatnya begitu saja sesuai keinginan Anda. Sebagai contoh, “warna” adalah properti CSS yang sebenarnya, sehingga Anda dapat menggunakannya. Property ini yang menentukan warna teks suatu elemen. Jika Anda mencoba menggunakan “teks-warna” atau “font-warna” sebagai properti CSS, ini akan gagal karena mereka bukan bagian sebenarnya dari bahasa CSS.

Baca Juga :  Pengertian Sistem Informasi: Fungsi, Karakteristik dan Komponennya Lengkap

Contoh lainnya adalah properti “background-image”. Properti ini menetapkan gambar yang dapat digunakan untuk latar belakang, seperti ini:

.logo {
background-image: url (/images/company-logo.png);
}

Jika Anda mencoba menggunakan “background-picture” atau “background-graphic” sebagai properti, mereka akan gagal karena, sekali lagi, ini bukan properti CSS sebenarnya yang cocok.

Contoh CSS Property

Ada sejumlah properti CSS yang dapat Anda gunakan untuk mendesain situs. Beberapa contohnya adalah:

  • Border
  • Padding
  • Margins
  • Font-family
  • Font-size
  • Background-color
  • Width
  • Height

Properti CSS ini bagus untuk digunakan sebagai contoh, karena semuanya sangat mudah dan bahkan jika Anda tidak tahu CSS, Anda mungkin dapat menebak apa yang mereka lakukan berdasarkan namanya.

Ada properti CSS lain yang akan Anda temui juga yang mungkin tidak jelas bagaimana mereka bekerja berdasarkan namanya:

  • Float
  • Clear
  • Overflow
  • Text-transform
  • Z-index

Ketika Anda masuk lebih dalam ke desain web, Anda akan menemukan (dan menggunakan) semua properti ini dan banyak lagi selain itu!

Properti Membutuhkan (Value) Nilai

Setiap kali Anda menggunakan properti, Anda harus memberikannya value (nilai) dan properti tertentu hanya dapat menerima nilai tertentu. Pada contoh pertama dari properti “warna”, kita perlu menggunakan nilai warna. Ini bisa berupa nilai hex, nilai RGBA, atau bahkan kata kunci warna.

Namun, salah satu dari nilai-nilai itu akan berfungsi, jika Anda menggunakan kata seperti “gloomy” dengan properti ini, itu tidak akan menghasilkan apa-apa karena, sejelas kata itu, nilai itu bukan nilai yang diakui dalam CSS.

CSS Value (nilai)

Mengenal Property dan Value dalam CSS Declaration (Deklarasi)
Mengenal Property dan Value dalam CSS Declaration (Deklarasi)

Apa itu CSS Value? CSS Value (Nilai-nilai CSS) ditetapkan terhadap Properti CSS dan berada di dalam blok deklarasi CSS, yang merupakan bagian dari aturan/pernyataan CSS. CSS 2.1 memungkinkan jenis nilai seperti Integer dan bilangan real, Panjang, Persentase, URL dan URI, Counters, Warna, String, Nilai-Nilai Yang Tidak Didukung (Unsupported Value).

Baca Juga :  Pengertian HDC (Hard Disk Controller atau Disk Controller) di Komputer!

Sedangkan HTML memiliki tag, CSS memiliki pemilih/penyeleksi. CSS Selector adalah nama yang diberikan untuk style dalam style sheet internal dan eksternal. Kali ini kita akan membahas mengenai pengertian CSS Value beserta penjelasannya yang akan berkonsentrasi pada pemilih HTML, yang akan membuat sederhana nama tag HTML dan digunakan untuk mengubah gaya jenis elemen tertentu.

Untuk setiap pemilih/penyeleksi ada “properti” yang di dalam kurung keriting (“{}”), yang hanya berupa kata-kata seperti warna, font-weight atau background-color, Value (Nilai) diberikan ke properti berikut tanda titik dua (BUKAN tanda “sama dengan”). Semi-titik dua digunakan untuk memisahkan properti.

body {
font-size: 14px;
color: navy;
}

Ini akan menerapkan nilai yang diberikan ke ukuran font dan properti warna ke Selector Body.

Jadi pada dasarnya, ketika ini diterapkan pada dokumen HTML, teks di antara tag tubuh (yang merupakan isi dari seluruh jendela) akan berukuran 14piksel dan berwarna navy. Itulah pada dasarnya yang harus kita pahami terutama dalam mempelajari dan mengenal Property dan Value dalam CSS Declaration.

Penutup

Demikianlah ulasan singkat Kami yang membahas mengenai Apa itu Property dan Value dalam CSS Declaration dan penjelasannya secara lengkap. Semoga artikel ini dapat bermanfaat dan dapat menambah wawasan Kita semua terutama dalam belajar Teknologi Informasi beserta Istilah-Istilah Teknologinya. Sekian dari Saya, Terima Kasih.

Tinggalkan Komentar