SEJARAH CSS
Nama CSS didapat dari fakta bahwa setiap deklarasi style yang berbeda dapat diletakkan secara berurutan, yang kemudian membentuk hubungan ayah-anak (parent-child) pada setiap style. CSS sendiri merupakan sebuah teknologi internet yang direkomendasikan oleh World Wide Web Consortium atau W3C pada tahun 1996. Setelah CSS distandarisasikan, Internet Explorer dan Netscape melepas browser terbaru mereka yang telah sesuai atau paling tidak hampir mendekati dengan standar CSS.
SIFAT CSS
Ada dua sifat CSS yaitu internal dan eksternal Jika internal yang dipilih, maka skrip itu dimasukkan secara langsung ke halaman website yang akan didesain. Kalau halaman web yang lain akan didesain dengan model yang sama, maka skrip CSS itu harus dimasukkan lagi ke dalam halaman web yang lain itu.
Sifat yang kedua adalah eksternal di mana skrip CSS dipisahkan dan diletakkan dalam berkas khusus.Nanti, cukup gunakan semacam tautan menuju berkas CSS itu jika halaman web yang didesain akan dibuat seperti model yang ada di skrip tersebut.
PERINTAH-PERINTAH CSS
Terdapat 3 cara untuk menuliskan perintah CSS (style sheet/lembar perintah CSS) :
- Eksternal style sheet
- Internal style sheet
- Inline style
Eksternal Style Sheet
Eksternal style sheet sangat ideal digunakan untuk halaman web yang banyak. Dengan cara ini, apabila Anda ingin mengubah tampilan web, Anda hanya perlu mengedit/mengubah file CSS saja. Untuk menggunakannya, setiap halaman harus di link-kan ke style sheet menggunakan tag link. Tag link diletakkan dibagian head.
1
2
3
| <head><link rel="stylesheet" type="text/css" href="style.css"></head> |
style.css merupakan nama file style sheet (CSS). File ini ditulis dengan perintah CSS tanpa mengandung tag HTML. Serta disimpan dengan ekstensi .css. Berikut contoh dari file style.css :
1
2
3
| hr {color:sienna;}p {margin-left:20px;}body {background-image:url("images/back40.gif");} |
Catatan : Ketika menuliskan value property dan unitnya, jangan menambahkan spasi (seperti “margin-left:20 px”). Namun yang benar ialah :
1
| margin-left:20px |
Internal Style Sheet
Cara ini, perintah CSS akan didefinisikan langsung dibagian head HTML, dengan menggunakan tag style.
1
2
3
4
5
6
7
| <head><style>hr {color:sienna;}p {margin-left:20px;}body {background-image:url("images/back40.gif");}</style></head> |
Inline Style
Cara ini, perintah CSS didefinisikan langsung pada tag HTML. Gunakan cara ini apabila perintah CSS yang didefinisikan sangat pendek.
Contoh berikut akan menambahkan warna dan margin pada paragraf :
1
| <p style="color:sienna;margin-left:20px">Ini adalah sebuah paragraf.</p> |
Tidak ada komentar:
Posting Komentar