Attributes

Attributes digunakan bersama-sama dengan tag. Apabila web browser membaca kod attribute, ia juga akan mencari tag yang digunakan. Dengan menggunakan attribute, pembangun laman web dapat mencantikan lagi laman web tersebut.

Terdapat banyak set attribute yang dapat digunakan bagi setiap tag. Walau bagaimana pun, dalam tutorial ini, kita hanya akan memfokus kepada attribute yang umum sahaja, iaitu attribute yang boleh digunakan oleh kebanyakan tag.

Atribut diletakkan dalam ruangan tag dan sebelum penutup untuk setiap tag.

Class atau ID Attribute

Kegunaan CLASS adalah hampir sama dengan ID attribute. Ia tidak akan menghasilkan sesuatu paparan atau tag. Namun ia digunakan sebagai tanda apabila anda menggunakan CSS. Dengan erti kata lainnya, penggunaan CLASS adalah merujuk kepada pengkumpulan atribute kepada ID tertentu bukan keseluruhan ID.

Idea penggunaan CLASS atau ID Attribute ini adalah supaya jika anda ingin menggunakan tag yang sama contohnya perenggan atau <p> didalam laman web anda tetapi setiap perenggan mempunyai gaya yang tersendiri.

HTML Code:

<p id="italicsparagraph">Paragraph type 1 Italics</p> 
<p id="boldparagraph">Paragraph type 2 Bold</p>

Preview:

Paragraph type 1 Italics

Paragraph type 2 Bold

Sekiranya tiada penggunaan CLASS dimasukkan dalam atribute tadi, maka kesan kepada keseluruhan <p> akan ditonjolkan.

Name Attribute

Name attribute adalah sama fungsingnya dengan Class atau ID Attribute tetapi ia digunakan dalam JavaScript, ASP, ataupun PHP. Name attribute akan bertindak sebagai pengasing sesuatu elemen. Dengan menamakan elemen tersebut, "script" (sama ada JavaScript, PHP atau ASP) hanya akan bertindak pada elemen yang dinamakan sahaja dan bukan kesemua elemen dalam laman web.

HTML Code:

<input type="text" name="TextField" />

Output:


 

Penggunaan "name" tidak akan menghasilkan apa-apa paparan atau kesan bagi INPUT di atas, tetapi ia memainkan peranan yang besar sebagai identiti kepada kotak tersebut apabila sebarang "script" dijalankan.

Title Attribute

Title attribute adalah attribute yang jarang digunakan. Walau bagaimanapun, ia berfungsi sebagai info ringkas kepada sesuatu teks dan gambar apabila penunjuk tetikus digerakan ke atas elemen bersebut (erti kata lain "mouseOver"). Apabila penunjuk tetikus berada di atas teks atau gambar yang mempunyai title attribute, ia akan mengeluarkan kekotak kecik berhampiran elemen tersebut (erti kata lain "popup").

HTML Code:

<h2 title="Selamat datang..!">Letakkan penunjuk anda disini</h2>

Title Attribute:

Letakan penunjuk anda disini

Align Attribute

Jika anda ingin mengubah posisi kedudukan teks atau gambar anda, ALIGN attribute adalah jawapannya. Align attribute berfungsi untuk mengubah posisi kedudukan teks atau gambar supaya ia berada di kanan, tengah atau dikiri. Jika Align attribute tidak dinyatakan, teks akan disusun dalam posisi sebelah kiri.

ALIGN = left (default) | center | right

HTML Code:

<h2 align="center">Tajuk ditengah</h2>

Paparan:

Tajuk ditengah

HTML Code:

<h2 align="left">Tajuk dikiri</h2>
<h2 align="center">Tajuk ditengah</h2>
<h2 align="right">Tajuk dikanan</h2>

Display:

Tajuk dikiri

Tajuk ditengah

Tajuk dikanan

Generic Attributes

Di bawah ini adalah koleksi set attribute yang secara umumnya boleh digunakan oleh kebanyakan tag-tag yang terdapat di dalam HTML.

Attribute Pilihan Fungsi
align right, left, center Menyusun teks atau gambar dalam keadaan mendatar
valign top, middle, bottom Menyusun teks atau gambar dalam keadaan menegak
bgcolor numeric, hexidecimal, RGB values Mewarnakan latar belakang
background URL Meletakan image sebagai latar belakang
id User Defined Nama bagi element untuk CSS
class User Defined Class bagi element untuk CSS
width Numeric Value Menentukan panjang element contohnya table
height Numeric Value Menentukan tinggi element contohnya table
title User Defined "Pop-up" untuk teks atau gambar

 

Penilaian: 
Average: 5 (2 votes)