Blog & Script Tutor - Melihat ribuan website/blog tertata rapi? atau disusun dengan warna ceria dan teratur? Jika itu mau anda, maka anda datang pada artikel yang tepat. Pasalnya, yang anda maksud tadi adalah css atau Cassading Style Sheet. Ia biasa berada di tengah tag head dalam html yaitu didalam tag style (penjelasan akan ada dibawah).Penggunaan Css in
i sangat penting dalam blog yang mengutamakan kenyamanan/keindahan blog untuk dibaca dan dilihat. Css ini sebenarnya memiliki fungsi utama bukan hanya mempercantik namun juga mengubah tampilan atau tag html atau istilahnya adalah pemformatan tag/id/class. Css memiliki 2 selector yang utama, dan 1 selector yang jarang dipakai (dipakai hanya untuk membuat menu atau apapun).
Selector pertama yaitu "id". Selector id ini sangat spesial karena dalam satu tag hanya boleh ada satu id. Id digunakan dengan bentuk tandapagar baru variabel/nama. Contoh #
id (yang digarisbawahi adalah idnya, misal #contoh). Cara penggunaannya bisa menggunakan tag html yang ada, tag div/span, ataupun tag buatan sendiri. Contoh
<div id="contoh">Hai</div> (dengan menggunkan id di style atas).
Selector kedua yaitu "class". Selector ini juga sama spesialnya dengan selector id. Jadi hanya boleh dipakai 1 kali dalam satu tag. Contohnya pun sama dengan id, namun hanya dengan mengganti id="contoh" dengan class="contoh" (sebelumnya di css harus dibuat class contoh, dengan cara .contoh).
Selector terakhir yaitu langsung tag. Selector ini digunakan seperti
<contoh>hai</contoh>. Dalam body boleh digunakan lebih dari satu, namun harus dideklarasikan dengan style yang diingankan terlebih dahulu jika tak ingin error.
Penempatan css didalam html sebagai berikut
<!doctype html>
<html>
<head>
<title>Latihan Css</title>
<style>
#contoh {
background-color:red;
}
.contoh {
color:white;
}
contoh {
margin:5px;
padding:5px;
}
</style>
</head>
<body>
<contoh id="contoh" class="contoh">halo</contoh>
</body>
</html>
.
Fakta unik :
> Css ini bisa dijadikan exsternal code dengan menambahkan
<link type="stylesheet/css" href="URL_CSS.css"></link>.
