Pengenalan CSS (Cascading Style Sheet)
Posted by: asianwoman on: Desember 21, 2009
Hmmm….. bingung harus mulai darimana. Biasanya kalo kita belajar sesuatu kita harus pelajari bagian luarnya dulu khan. Jadi, pertama kita kenali dulu apa sebenernya CSS itu.
Apa itu CSS ?
CSS adalah singkatan dari Cascading Style Sheet yang tidak lain adalah standard untuk membuat dan memakai style untuk dokumen yang terstruktur.
Apa kegunaan dari CSS?
CSS digunakan untuk mempersingkat penulisan tag HTML seperti color, font, table dan text menjadi lebih ringkas sehingga tidak terjadi pengulangan penulisan.
Selain itu, CSS juga memungkinkan halaman yang sama untuk ditampilkan dengan cara yang berbeda untuk metode presentasi yang berbeda, seperti melalui layar, cetak, suara, dan juga alat pembaca braille.
Trus, apa keuntungan dari CSS?
1. CSS dapat memisahkan presentasi sebuah dokumen dari content dokumen itu sendiri
2. CSS dapat mempercepat proses rendering/ pembacaan HTML
3. CSS dapat mempermudah dan mempersingkat pembuatan serta pemeliharaan dokumen web
Selain punya keuntungan, ternyata CSS juga punya kekurangan.
Kekurangan CSS adalah tidak semua browser dapat mengartikan kode CSS dengan cara yang sama. Maksudnya?
Terkadang, tampilan web dengan CSS terlihat baik di browser yang satu, tapi berantakan atau tidak sesuai dengan keinginan kita di browser yang lain. Kalo gitu jadi repot ya.
Jadi kita harus memeriksa tampilan supaya terlihat baik di semua browser dan menambahkan kode-kode khusus browser tertentu jika ingin tampilannya terlihat bagus.
Ada beberapa istilah dalam CSS apa aja sih itu?
Istilah-istilah dalam CSS:
1. Style rule
Cascading style sheet adalah kumpulan aturan yang mendefinisikan style dari document.
Contohnya saja kita bisa membuat aturan style yang menentukan bahwa semua <H1> di tampilkan dengan warna purple (ungu).
Style rule juga bisa digunakan pada bagian tertentu dari web page. Contohnya kita bisa menentukan suatu paragraph tertentu agar ditampilkan dengan style bold dan italic ataupun underline sedangkan yang lain tetap seperti biasa.
2. Style sheet
Style sheet dapat di embedded ke HTML document atau biasa disebut embedded style sheet. Style sheet juga bisa dibuat sebagai external file dan di link ke document HTML.
3. Selector
selector { property1: value; property2:value, . . .} H2{ color:green; background-color:pink} Style sheets terdiri dari dua bagian:
a. Selector à bagian pertama sebelum tanda “{}” disebut selector
b. Declaration à Terdiri dari property dan nilainya.
CSS terdiri dari dua elemen dasar, yaitu : “selector” dan “declaration”.
Sebuah selector biasanya adalah tag HTML (<b>,<i>,<body>), sementara declaration adalah suatu perintah/nilai dari CSS yang menunjukkan type bentuk yang diaplikasikan pada selector.
Declaration ini biasanya ditandai dengan kurung kurawal, dan perintah/nilai CSS yang berbeda dipisahkan satu dengan yang lain menggunakan titik koma.
Bagaimana cara menggunakan CSS? Dimana kita bisa menempatkan code CSS?
Ada tiga cara penempatan kode CSS dalam HTML, yaitu :
1. Internal CSS
yaitu dengan menuliskan secara langsung script CSS kedalam file HTML.
Contoh :
<html>
<head>
<title>CSS ku</title>
<style type=”text/css”>
p {color: blue;}
body {background-color: green;}
</style>
</head>
<body>
<p>pengenalan CSS</p>
</body>
</html>
2. External CSS
yaitu dengan cara kita membuat file CSS tersendiri dengan eksistensi *.css dan terpisah dari file html dan ditempatkan atau diletakkan di folder lain atau di folder yang sama dengan file html tersebut. Browser akan membaca file tersebut dan akan menampilkan file html sesuai dengan format yang telah kita atur dalam file CSS.
Contoh :
<html>
<head>
<title>CSSku</title>
<link rel=”stylesheet” type=”text/css” href=”file.css”/>
</head>
<body>
<p>pengenalan CSS</p>
</body>
</html>
3. Inline CSS
yaitu dengan menuliskan secara langsung script CSS kedalam tag HTML.
Contoh :
<html>
<head>
<title>CSS ku</title>
</head>
<p style=”background: purple; color: blue;”>pengenalan CSS</p>
</body>
</html>
Karena saya hanya tahu sebatas ini saja, maka saya akhiri dulu postingan saya.
1 Tanggapan to "Pengenalan CSS (Cascading Style Sheet)"
Tinggalkan Balasan
free download ost anime, ost drama asia
Pengarang
Komentar Terakhir
 | asianwoman on Cara membuat animasi dengan mo… |
| asianwoman on Sassy girl chun hyang (song… |
 | Snow on Sassy girl chun hyang (song… |
 | The Hanbok ~ Part 1:… on Hanbok clothes |
 | azwan on Cara membuat animasi dengan mo… |
| azwan on Sassy girl chun hyang (song… |
 | jean on gigi palsuku |
| asianwoman on Cara membuat animasi dengan mo… |
 | jasa penerjemah on Cara membuat animasi dengan mo… |
| asianwoman on Indonesian culture {traditiona… |
| asianwoman on Kimono |
| asianwoman on gigi palsuku |
| asianwoman on This is my family |
| asianwoman on Cara membuat tweening shape de… |
| asianwoman on Indonesian Culture ( Tradition… |
Februari 12, 2010 pada 1:00 pm
I’m sorry but I don’t know your comment.
Are you Japanese???