Pendefinisian dengan External Style Sheet

Pendefinisian dengan External Style Sheet | Pada pembahasan-pembahasan sebelunya, style sheet dalam bentuk header diletakkan di dalam dokumen yang bersangkutan.  Baik itu di dalam HEAD, maupun di dalam BODY. Bagaimana jika kita ingin agar pendefinisian style sheet tersebut diletakkan pada sebuah file tertentu terpisah dengan dokumen HTML tersebut ? Inilah yang disebut External Style Sheet (style sheet luar).

Keuntungan dari External Style Sheet ini adalah  mempermudah modifikasi style tanpa harus menyentuh dokumen HTML yang bersangkutan. Selain itu juga, pembuat homepage tidak usah capek-capek membuat definisi-definisi baru di setiap dokumen. Dengan adanya ExternalStyle Sheet, misalnya alternatif yang pertama ukuran huruf sedang, sedangkan pada alternatif kedua ukuran huruf besar. Pembuat homepage juga dapat menentukan mana alternatif terbaik yang akan digunakan.
Hal-hal yang perlu diketahui dalam membuat External Style Sheet : 

1. Tag yang digunakan adalah LINK
2. Atribut utama yang digunakan adalah HREF dengan nilai nama External Style Sheet tersebut (misalnya aangstyle.css) atau URL dari file External Style Sheet tersebut.
3. Untuk membuat “Persistent Style Sheet” (Style Sheet yang paten), digunakan atribut tambahan REL dengan nilai stylesheet, tetapi jangan sampai menyertakan atribut TITLE.
4. Untuk membuat “Persistent Style Sheet” (Style Sheet terbaik), digunakan atribut tambahan REL dengan nilai stylesheet, dan atribut TITLE dengan nilai nama tertentu.
5. Untuk membuat “Alternate Style Sheet” (Style Sheet Alternatif), digunakan atribut tambahan REL dengan nilai alternate stylesheetdan atribut TITLE  dengan nilai nama tertentu.

Bisa juga ditambahkan atribut lainnya yaitu TYPE dengan nilai, misalnya text/css.

Contoh:

• Untuk membuat “Persistent Style Sheet” :

<LINK HREF =”aangstyle.css”
 REL=”stylesheet” TYPE=”text/css”>

• Untuk membuat “Preffered Style Sheet” :

<LINK HREF=”terbaik.css” TITLE=”MEDIUM” REL=”stylesheet” TYPE=”text/css”>

• Untuk membuat “Alternate Style Sheet”:

<LINK HREF=”alternatif.css” TITLE=”besar” REL=”alternate stylesheet” TYPE=”text/css”>

• Ingat nilai dari HREF=”../style/mystyle.css”> atau

<LINK HREF=http://www.aang.com/mystyle.css REL=”stylesheet” TYPE=”text/css”>

• Ingat, bentuk penulisan LINK bisa seperti ini :

<LINKL HREF=”aangstyle.css” REL=stylesheet”>

• Namun jangan sekali-sekali manulisnya hanya dengan bentuk seperti berikut :

<LINK HREF=”aangstyle.css”> 

Karena, tampilan pada browser nanti, tidak akan sesuai dengan style sheet yang telah didefinisikan. Ini disebabkan karena tidak adanya REL=”STYLESHEET” yang mengakhibatkan browser tidak mengenali adanya Externanal Style Sheet yang dipanggil oleh homepage tersebut.

Cukup sekian dulu tutorialnya tentang Pendefinisian dengan External Style Sheet  dan terimakasih.