Mengenal Atribut Html

Setelah pada sebelumnya saya telah memperlihatkan tutorial pengenalan elemen-elemen HTML pada kali ini saya akan melanjutkan tutorial dengan pembahasan Atribut HTML. Dalam tutorial kali ini Sobat akan mempelajari mengenai jenis-jenis atribut dan kegunaan atribut tersebut, Atribut berkhasiat dalam memperlihatkan sebuah info suplemen mengenai elemen HTML.

Perlu diketahui:

  • Sebuah elemen HTML sanggup mempunyai atribut
  • Atrbut akan memperlihatkan info suplemen mengenai sebuah elemen
  • Atribut selalu tercantum dalam tag pembuka
  • Atribut tiba dengan sebuah pasangan nama maupun nili seperti: (name="value"
Mungkin teman yang masih awam akan merasa galau dengan teori-teori diatas, tapi damai saja teman akan sehabis membaca tutorial ini hingga selesai di jamin teman akan mengerti.

Atribut lang

Atribut lang berfungsi sebagai penetapan sebuah isyarat bahasa pada sebuah elemen, penempatan atribut lang dicantumkan dalam tag </html>. Mendeklarasikan sebuah bahasa sangatlah penting alasannya berkhasiat untuk aplikasi aksesibilitas (scren reader) maupun pada mesin pencari, sebagai contoh:
<!DOCTYPE html>
<html lang="en-ID">
<body>
<h1>Postingan Pertama Sobat</h1>
<p>Paragraph pertama sobat</p>
</body>
</html>
Pada dua aksara pertama memilih sebuah bahasa (en), jikalau ada bahasa lainnya maka gunakan dua aksara lainnya (ID).


Paragraph HTML yang didefinisikan oleh tag <p>


Dalam pola ini saya akan memperlihatkan atribut judul pada paragraph HTML <p> dengan nilai atribut mengenai Pusat Tutorial. sebagai contoh:
<!DOCTYPE html>
<html>
<body>

<h1>Tutorial</h1>

<p title="Mengenal Atribut HTML">
Tutorial yakni sebuah situs blog.
Disini menyediakan Referensi dan Tutorial untuk materi pembelajaran sobat
yang meliputi banyak aspek pemrograman, Design dan Editing, Tips & Trik. Dan masih banyak lagi yang ingin kita sajikan yang mungkin akan menyusul kemudian :)
</p>

<p><b>
Jika teman menggerakkan kursor mouse pada paragraph di atas,
maka judul akan ditampilkan sebagai tooltip.
</b></p>

</body>
</html>
Hasil diatas:


Catatan: Pada dikala teman menggerkan kursor mouse diatas elemen maka judul akan ditampilkan sebagai sebuah tooltip.
silahkan teman coba sendiri.


Atribut href

Dengan memakai atribut href teman sanggup menciptakan sebuah link URL, untuk membuatnya.. link HTML perlu didefinisikan dengan tag <a> kemudian alamat linknya dicantmkan dalam atribut href, teman akan lebih banyak berguru perihal link dan tag <a> nanti pada tutorial ini. sebagai contoh:
<!DOCTYPE html>
<html>
<body>

<a href="http://www.tut.blogspot.com">Ini link nya Tutorial</a>

</body>
</html>
Hasil diatas:




Ini link nya Tutorial
silahkan teman coba sendiri.

Atribut Size (ukuran)
Atribut size berkhasiat dalam mengatur ukuran pada pola ini kita akan mengaplikasikannya untuk menampilkan dan mengatur ukuran sebuah gambar, gambar dalam HTML didefinisikan dengan tag <img /> kemudian didalam tag tersebut dicantumkan (src) yang merupakan sumber dari nama berkas dan (width dan height) merupakan yang mengatur dari segi ukuran lebar dan tinggi dari sebuah gambar, teman akan lebih banyak berguru perihal gambar dan tag <img /> nanti pada tutorial . sebagai contoh:
<!DOCTYPE html>
<html>
<body>

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnSrqGwxKos53QfcM-PRXz2NsD4GiJIfkR3vnSSjlWtu2CSRQE-Dk9u4-yTYEtgCBHq5n_MCK7CcNyLKdjpfQx1asyRpvQg71Ow3ablD4dQPG0qPyE29aEYi7c0H19ge0l8g5k3DxR4H0p/w90-h77-no/pustut1.png" width="108" height="135">

</body>
</html>
Hasil diatas:




silahkan teman coba sendiri.

Atribut Alt

Fungsi dari atribut alt yakni untuk memilih sebuah teks alternatif yang akan dipergunakan pada dikala sebuah elemen HTML tidak sanggup ditampilkan di browser.
Sebagai contoh:
<!DOCTYPE html>
<html>
<body>

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnSrqGwxKos53QfcM-PRXz2NsD4GiJIfkR3vnSSjlWtu2CSRQE-Dk9u4-yTYEtgCBHq5n_MCK7CcNyLKdjpfQx1asyRpvQg71Ow3ablD4dQPG0qPyE29aEYi7c0H19ge0l8g5k3DxR4H0p/w90-h77-no/pustut1.png" alt=" Setelah pada sebelumnya saya telah memperlihatkan tutorial pengenalan elemen Mengenal Atribut HTML" width="108" height="135">

</body>
</html>
hasil diatas:



 Setelah pada sebelumnya saya telah memperlihatkan tutorial pengenalan elemen Mengenal Atribut HTML
Silahkan teman coba sendiri.
Disarankan: Agar selalu memakai aksara kecil dalam menuliskan atribut, tapi pada standar HTML5 dalam menuliskan nama atribut tidak perlu menuliskan nama atribut dengan aksara kecil saja menuliskan nama atribut dengan aksara besapun boleh hanya saja W3C merekomendasikan penggunaan nama atribut dengan aksara kecil untuk HTML4 dan menuntut aksara kecil dalam jenis dokumen yang ketat menyerupai XHTML.
Catatan: Penggunaan nama atribut dengan aksara kecil merupakan yang paling umum alasannya memakai aksara kecil lebih gampang dalam proses pengetikan.
Disarankan: Selalu gunakan tanda kutip pada nilai atribut meskipun pada standar HTML5 tanda kutip tidak dibutuhkan untuk nilai atribut.
sebagai pola nilai atribut yang tidak diberi tanda kutip:
<!DOCTYPE html>
<html>
<body>

<a href=http://www.pus-tut.blogspot.com>Ini link nya Pusat Tutorial</a>

</body>
</html>
Hasil diatas:



Ini link nya Pusat Tutorial
Catatan: Penggunaan tanda kutip merupakan yang paling umum dipakai alasannya menghilangkan tanda kutip sanggup menghasilkan sebuah kesalahan.
silahkan teman coba sendiri.


Single atau double Quotes (kutip)


Penggunaan tanda kutip, gaya tanda kutip double memang merupakan yang paling umum dipakai namun gaya tanda kutip single pun sanggup digunakan. Tetapi pada beberapa situasi pada dikala nilai atribut itu sendiri mengandung tanda kutip double maka penggunaan tanda kutip single diperlukan.
sebagai contoh:
<title p='PusTut"blogspot"com'>
ataupun sebaliknya:
<title p="PusTut'blogspot'com">

Atribut HTML

Dibawah ini mrupakan daftar dari beberapa atribut HTML yang sering digunakan:


Gimana nih teman sudah mengerti bukan perihal Pengenalan Atribut HTML? mudah-mudahan tutorial ini sanggup dimengerti oleh teman dan bermanfaat tentunya. Kalo gitu sekian untuk tutorial Pengenalan Atribut HTML, kita akan lanjutkan kembali tutorial HTML di tutorial berikutnya :)

0 Response to "Mengenal Atribut Html"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

loading...

Iklan Tengah Artikel 2

loading...

Iklan Bawah Artikel