Di artikel sebelumnya kita sudah membahas tentang metode penulisan css, dan di artikel ini kita akan membahas lebih dalam lagi tentang css di html. seperti yang sudah di jelaskan di artikel sebelumnya, css berfungsi sebagai pengatur tampilan elemen-elemen dalam dokumen html. sruktur css di bagai
menjadi tiga bagain yaitu slector , propertiy dan value.
Struktur dasar CSS sebagai berikut:
slector { properti : value; }
Selector di CSS
Selector dalam css adalah key atau kunci untuk mengakses elemen html.
selector di CSS bisa berupa tag seperti a, p, H1, div, span, ul, li dan lain-lain atau atribut html khusus. mengenai atribut yang bisa di gunakan sebagai selector di css, kita akan bahas secara khusus di artikel selanjutnya.
Property di CSS
Property merupakan bagian element yang akan di manipulasi nilainya seperti lebar element, posisi elemen dalam dokumen, warna element, background element dan lain-lain. contoh jika selector adalah tag p makan property yang bisa di gunakan seperti ukuran huruf, warna huruf, backround huruf dan lain-lain.
CSS memiliki banyak property untuk memudahkan pengguna dalam memodifikasi dokumen html dengan lebih leluasa.
Value di CSS
Value di CSS adalah nilai atau parameter yang akan di berikan kepada element html. misalnya kita memiliki tag p sebagai selector dan background sebagai property maka value yang cocok adalah warna. untuk value warna bisa kita tulis nama warnanya atau bisa juga dengan kode hex.
Contoh program dari simulasi diatas sebagai berikut:
Contoh CSS
<html>
<head>
<title></title>
<style type="text/css">
body {
background:cyan;
}
h1{
color:red;
font-size:20px;
background:black;
}
p{
color:blue;
font-size:20px;
}
</style>
</head>
<body>
<h1>belajar html dan css dasar</h1>
<p>selamat belajar html </p>
</body>
</html>
Preview
belajar html dan css dasar
selamat belajar html