Studio Press

Style sheets merupakan unsur yang sangat penting dalam membuat dynamic HTML. Meskipun bukan merupakan suatu keharusan dalam membuat web, akan tetapi penggunaan style sheets merupakan kelebihan tersendiri. Suatu style sheet merupakan tempat dimana anda mengontrol dan memanage style-style yang ada. Style sheet mendeskripsikan bagaiman tampilan document HTML di layar. Dapat disebut juga sebagai template dari documents HTML yang menggunakanya.

Misalnya membuat efek-efek spesial di web dengan menggunakan style sheet.
Secara teoritis bisa menggunakan style sheet technology dengan HTML, akan tetapi pada prakteknya hanya Cascading Style Sheet (CSS) technology yang support pada hampir semua web Browser. Karena CSS telah di standardkan oleh World Wide Web Consortium (W3C) untuk di gunakan di web browser.

Inline styles
Ada dua cara yang bisa digunakan untuk merubah style dari web page, yaitu dengan :

1. Merubah inline style
2. Menulis script untuk merubah style.

Dengan meggunakan inline style anda dapat membuat dynamic style tanpa harus menambahkan script ke web. Inline styles merupakan style yang bisa dipasang pada element web tertentu saja. Contohnya adalah jika ingin menambahkan style pada

Dengan meggunakan inline style anda dapat membuat dynamic style tanpa harus menambahkan script ke web. Inline styles merupakan style yang bisa dipasang pada element web tertentu saja. Contohnya adalah jika ingin menambahkan style pada <H1> dengan warna merah, harus mengeset attribut STYLE dari tag <H1>.
<H1 STYLE=”color:red”>
jika ingin menggunakan script untuk memodifikasi inline style, dapat menggunakan Style Object. Style Object mensupport semua property yang di support CSS untuk style. Untuk menggunakan property pada script :

1. Hilangkan tanda hubung “-” dari property CSS Style
2. Ganti huruf setelah tanda hubung menjadi Capital.

Contoh adalah dengan mengganti font-weight menjadi fontWeight, dan mengubah text-align menjadi textAlign.

Istilah-istilah dalam style sheet

a. Style rule
Cascading style sheet merupakan kumpulan aturan yang mendefinisikan style dari document. Sebagai contoh, membuat aturan style yang menentukan bahwa semua <H2> di tampilkan dengan warna orange.

b. Style sheet
Style sheet dapat dapat di embedded ke HTML document. Atau disebut embedded style sheet. Style sheet juga bisa dibuat sebagai external file dan di link ke document HTML. Style role bisa di kenakan pada bagian tertentu dari web page. Sebagai contoh, menentukan paragraph tertentu di tampilkan dengan style bold dan italic sementara yang lain tetap seperti biasa.

c. Selector
Pada style sheet, terdiri dari dua bagian, yaitu selector dan declaration. Selector merupakan bagian pertama sebelum dideklarasikan selector {declaration}.

selector { property1: value; property2:value, . . .}
H1{ color:green; background-color:orange}

d. Komentar dalam style sheets
Comments atau komentar biasanya di gunakan oleh programmer untuk memudahkan mengingat kembali script yang sudah di tulisnya, Comments di CSS hampir sama dengan comments di C atau C++ yaitu dengan menggunakan:

/* isi Comments */
Contoh:

H1 { color:blue;} /* H1 elements akan menjadi biru */
Tags.H1.color = “blue”; /* H1 elements akan menjadi biru */

e. Link ke sheet lainnya
Apabila menginginkan style yang sama untuk halaman HTML yang lain, disarankan memperguakan sheet-sheet terpisah namun satu dan lainnya terhubung dengan cara link. Dapat mengikuti cara berikut ini :

<link rel="stylesheet" href="style.css">

Kode tag untuk link ini ditempatkan di bagian "head" dokumen. Perintah rel perlu diatur dengan pernyataan "stylesheet" agar supaya browser dapat menemukan perintah href sebagai penunjukan ke alamat Web (URL) sheet.