CSS digunakan untuk mengatur tampilan halaman website maupun blog agar tampilan halaman website atau blog terlihat lebih menarik dan lebih berwarna. CSS tidak hanya berfungsi untuk mengatur warna pada halaman website saja, tetapi CSS juga dapat mengatur beberapa Style atau gaya pada suatu halaman website seperti tata letak gambar, footer, heading, body, warna link, margin, ukuran garis, dan banyak lagi lainnya.
Jenis-jenis CSS
CSS pada saat ini memiliki 3 Versi yaitu CSS 1, CSS 2, dan CSS 3.CSS 1 adalah CSS yang dikembangkan berpusat pada format dokumen HTML, CSS 2 adalah CSS yang memenuhi kebutuhan terhadap format dokumen agar dapat digunakan atau ditampilkan pada mesin cetak seperti printer, kemudian CSS 3 adalah versi CSS saat ini yang dikenal mampu melakukan banyak hal menarik dalam melakukan desain suatu halaman website atau blog. Kelebihan dari CSS 3 yaitu dapat menggerakan atau menjalankan animasi pada halaman website atau blog seperti animasi berwarna hingga yang lebih menarik lagi yaitu animasi 3D. Pada CSS 3 ini para desainer template blog atau desainer website diberikan kemudahan dalam membuat salah satu template atau halaman website yang responsive (kompatibel dengan alat yang digunakan dalam membuka suatu halaman website seperti menggunakan smartphone, tablet, PC, dan lain-lain).
Penulisan CSS
Sebelumnya, anda perlu melihat contoh CSS berikut ini :
h1 {
color: #000000;
}
Keterangan :
h1 disebut dengan selector. kemudian kode yang berada di dalam "{}" disebut dengan declaration yang terdiri dari 2 unsur yaitu Property dan Value.
h1 = Selector
color = Property
#000000 = Value
CSS memiliki 3 metode penulisan yaitu :
Inline Style Sheet
Metode penulisan ini biasanya ditulis langsung pada tag HTML yang bersangkutan. CSS Seperti ini menurut saya cukup boros karena jika anda menggunakan metode penulisan CSS Inline Style Sheet, maka disetiap tag HTML yang anda buat harus meletakan CSS terlebih dahulu. Contoh :
<p style="font-size:10px;text-align:center;">Test Tulisan berukuran 10 pixel dengan rata tengah</p>
Embedded Style Sheet
Metode penulisan ini sangat mudah digunakan karena anda hanya perlu meletakan tag <style type="text/css"> ... </style> diatas tag <body>. Contoh penulisan :
<style type="text/css">
h1{
font-color:#ffffff;
background:#000000;
font-family:Arial;
}
</style>
External Style Sheet
Metode ini, anda dapat memanggil file css yang berekstensi .css yang terdapat pada direktori tertentu di file hosting. Untuk memanggil file .css, lihat contoh dibawah ini :
<link rel="stylesheet" type="text/css" href="lokasi.css"/>
Penggunaan CSS memang sangat penting bagi para desainer website atau template blog karena tanpa CSS anda tidak akan mendapatkan tampilan halaman website atau blog yang indah dan lebih menarik.
0 komentar:
Post a Comment