CSS Tutorial


CSS. Apa itu CSS? CSS, merupakan singkatan dari 'Cascading Stylesheet' yang biasanya digunakan untuk men-design bagian tertentu pada website maupun semua bagian website apabila tidak ada setting khusus untuk mendesain
website tersebut. CSS juga dapat digunakan untuk mengatur animasi, seperti blur, dan sebagainya, namun untuk animasi yang lebih lanjut seperti toggle effect dll, itu harus dilakukan dengan JavaScript, bukan dengan CSS.



CSS Selector

Untuk men-design suatu website, pertama-tama kita harus menyeleksi ID yang ingin kita design menggunakan CSS. contoh seperti apabila kita mempunyai kode berikut :


<html>
<body>
<div id="bagianyangingindidesign">Halo, ini bagian yang akan di-design menggunakan CSS, sebelum itu,</div><br>
<span>SALAM KENAL!</span>
</body>
</html>
Nah, pada contoh di atas, kita akan menyeleksi ID 'bagianyangingindidesign', misalnya dengan mengubah warna font menjadi royal blue, dan mengubah font menjadi Georgia, maka kita akan menggunakan code berikut :

#bagianyangingindidesign {
color:royalblue; /* ini akan mengubah warna font menjadi royal blue */
font-family:Georgia; /* ini akan mengubah font menjadi Georgia */
}
 Nah, apakah kalian merasa heran dengan tanda pagar (#) yang ada di samping nama ID?  yup, tidak semua ID menggunakan simbol '#' apabila diseleksi. Itu hanya digunakan pada HTML yang menggunakan code
Untuk membedakannya, kalian dapat melihat code dibawah :

<html>
<body>
<div class="test">Testing class</div>
<div id="testjuga">Testing ID</div>
</body>
</html>
<style>
.test {
font-family:Georgia;
font-style:italic;
color:cyan;
}

#testjuga {
font-family:Arial;
font-weight:bold;
color:navy;
}
</style>

 Ingat, tanda titik (.) untuk div class, sementara tanda pagar (#) untuk div id.  semoga ini dapat memperluas wawasan kalian, mohon maaf kalau ada kata-kata yang terkesan menyinggung atau ada kesalahan, untuk sementara ini saja. Terima kasih.