Belajar HTML : Pengertian Atribut dan contoh dalam HTML #4

Atribut dalam HTML


    Atribut adalah informasi tambahan yang diberikan kepada tag. Informasi ini bisa berupa instruksi untuk warna dari text, besar huruf dari text, dll. Setiap atribut memiliki pasangan nama dan nilai (value) yang ditulis dengan name=”value”. Value diapit tanda kutip, boleh menggunakan tanda kutip satu (‘) atau dua (“).

Contoh : 

<p align="center">Tulisan dengan format rata tengah</p>
    Dalam contoh diatas Atribut dengan name align dan memiliki value "center" Tidak semua tag membutuhkan atribut, tapi anda akan sering melihat sebuah tag dengan atribut, terutama atribut id dan class yang sering digunakan untuk manipulasi halaman web menggunakan CSS maupun JavaScript.HTML memiliki banyak atribut yang beberapa diantaranya hanya cocok untuk tag tertentu saja. Sebagai contoh, atribut “align” diatas hanya digunakan untuk tag <p> saja (dan beberapa tag lain). 


Ada empat atribut penting yang sering digunakan dalam tag HTML:

1. Id
2. Class
3. Title
4. Style

Atribut yang pertama adalah Id berfungsi untuk mengidentifikasi keunikan dari setiap elemen yang ada dalam satu halaman web. Artinya dalam sebuah tag hanya akan ada satu nama Id.Nah nantinya atribut Id akan kita gunakan saat bermain dengan css.


Berikut adalah contoh penulisan atribut Id:

<!DOCTYPE html>
<html>

   <head>
      <title>Tulisan</title>
   </head>

   <body>
      <p id="pertama">Ini adalah tulisan pertama</p>
      <p id="kedua">Ini adalah tulisan kedua</p>
   </body>

</html>
    Lalu selanjutnya adalah atribut Class atribut ini tidak jauh  beda fungsinya dengan atribut Id namun pada Class ini bisa ditambahkan tidak hannya satu keunikan 

contoh sebagai berikut :

<!DOCTYPE html>
<html>

   <head>
      <title>Atribut Class</title>
   </head>

   <body>
      <p class="judul inti">Contoh atribut class</p>
   </body>

</html>
pada contoh diatas terdapat 2 Class dalam satu tag HTML yaitu judul dan inti,Nantinya ini juga akan berguna saat belajar CSS


    Yang ketiga adalah atribut Title digunakan untuk kata kunci dari judul ataupun gambar dari sebuah elemen website. Berfungsi untuk menjelaskan lebih detail terkait hal yang diberikan tag title.

contoh sebagai berikut :

<!DOCTYPE html>
<html>

   <head>
      <title>atribut title</title>
   </head>

   <body>
      <h3 title="Selamat datang di Blog kami">Blog sirawang</h3>
   </body>

</html>
Kalian bisa coba eksekusi kode tersebut lalu lihat bagaimana hasilnya 


    Terakhir adalah atribut style jika dalam bahasa indonesia artinya gaya fungsinya tentu saja memberikan gaya terhadap suatu atribut contoh dalam sebuah paragraf kita akan menambahkan warna seperti merah maka kodenya nanti seperti ini

<p style="color:#FF0000;">tulisan yang nantinya akan berwarna merah</p>
Dan yang di masukkan dalam atribut style tersebut tidak lain adalah kode CSS nantinya kita akan bahas juga peletakan kode css internal dan external

   

Komentar

Archive

Formulir Kontak

Kirim