Properti dari suatu elemen html disebut

Atribut elemen pada HTML merupakan informasi tambahan suatu elemen HTML. Atribut ini ditempatkan di dalam tag pembuka elemen tersebut, jika elemen tersebut memiliki tag pembuka dan tag penutup. Atribut memiliki dua buah bagian yaitu nama (name) dan nilai (value) yang dipisahkan dengan tanda "=".

Table of Contents Show

Apa saja elemen elemen HTML?
Atribut HTML apa saja?
Apa itu atribut global?
Apa kegunaan atribut style pada HTML?

Setiap elemen HTML memiliki atribut yang digunakan sebagai alat untuk proses identifikasi sifat dan karakteristik tersebut tersebut. Pemberian atribut ini kadang diperlukan saat kita ingin memodifikasi tampilan elemen yang masih bersifat default. Misalnya seperti ingin menambahkan lebar elemen dengan mengatur nilai width (lebar) elemen dengan nilai tertentu. Atau jika kita ingin mengatur tinggi elemen, maka atribut height (tinggi) diberikan nilai tertentu sehingga tinggi elemen tersebut sesuai dengan keinginan.

Atribut memberikan informasi tambahan tentang elemen HTML. Secara global setiap elemen HTML memiliki atribut id, class, style, width, height dan lainnya sesuai dengan kegunaannya masing-masing. Secara khusus terdapat elemen HTML yang hanya memiliki atribut untuk elemen itu sendiri dan tidak bisa diaplikasikan untuk elemen lainnya misalnya elemen

Atribut elemen HTML selalu diletakkan di dalam tag pembuka elemen HTML. Setiap atribut memiliki sebuah nama disertai dengan nilainya. Nama (name) atribut didefinisikan sebagai nama properti elemen sedangkan nilai (value) atribut merupakan nilai yang diberikan untuk mengatur tampilan elemen tersebut.

Misalnya terdapat sebuah elemen

Paragraf 1

. Elemen tersebut memiliki dua buah atribut yaitu id dan style. Inilah yang disebut sebagai nama atribut. Kedua atribut di atas memiliki nilai atribut yaitu id="par1" dan style="color:navy;". Penulisan nilai atribut dengan memberikan tanda kutip tunggal atapun ganda yang mengapit nilai dari atribut tersebut.

Atribut ID digunakan untuk menetapkan identitas unik suatu elemen HTML. Di dalam suatu badan HTML yang memiliki banyak elemen, nilai atribut id harus berbeda satu sama lainnya dan bersifat unik. Jika suatu elemen paragraf sudah menggunakan id="par1" maka elemen lainnya tidak boleh menggunakan nilai id yang sama (id="par1") tapi harus menggunakan nilai yang lain misalnya id="par2" .

Berikut ini contoh halaman yang mempunyai elemen dengan atributnya :

Ini adalah paragraf ke-1

Ini adalah paragraf ke-2

Ini adalah paragraf ke-3

Ini adalah paragraf ke-4

Ini adalah paragraf ke-5

Berikut tabel daftar atribut dan nilainya yang sering disertakan di dalam elemen HTML :

Nama atributNilai atributKegunaaniduser definedMenetapkan id unik untuk elemen tunggalclassuser definedMenetapkan class untuk banyak elemenstyleuser definedMenetapkan gaya pada elemen dengan CSSwidthnilai angkaMenetapkan lebar elemenheightnilai angkaMenetapkan tinggi elemenalignleft, center, rightMenetapkan align horizontal suatu elemenvaligntop, middle, bottomMenetapkan align vertikal suatu elemencolordecimal, heksadesimal, rgbMenetapkan warnabgcolordecimal, heksadesimal, rgbMenetapkan warna latar dalam bentuk warna desimal, heksadesimalbackgroundURL gambarMenetapkan gambar latar (image png, gif, jpeg)titleuser definedMenetapkan pop-up title yang muncul saat elemen dilintasi mousesrcURL elemen, sumberMenetapkan referensi URLhrefURL elemen, sumberMenetapkan referensi URLnameuser definedMenetapkan nama elemenmethodpost, getMenetapkan metoda yang dipakai dalam mengirim formulir (post, get)actionURLMenetapkan halaman tujuan pengiriman formulirenctypeuser definedMenetapkan type enkripsi pengiriman formulirtypetext, password, submit, dllMenetapkan jenis elemenvalueuser definedMenetapkan nilai elemen (formulir)

Penggunaan Style dan Atribut dalam Elemen HTML cukup penting untuk memperindah tampilan halaman web dan pengaturan tag-tag agar dapat berfungsi secara optimal. Style bermanfaat untuk mengatur gaya dari elemen html bagaimana ditampilkan, seperti mengatur warna latar halaman web, mengatur warna, ukuran, jenis huruf, dll. Sedangkan atribut memberikan informasi tambahan tentang elemen html, dimana style juga termasuk salah satu atribut yang digunakan dalam elemen html.

Semua elemen html dapat memiliki atribut yang diletakan selalu di bagian tag pembuka dengan nama dan nilainya, seperti <div width=”100px”>…</div>, dimana width=”100px” adalah atribut dengan width sebagai nama atribut dan 100px sebagai nilai dari nama atribut width. Berikut ini beberapa atribut elemen html yang sering digunakan, diantaranya:

style, merupakan atribut penggunaan css untuk mengatur gaya isi elemen yang diletakan dalam tag pembuka elemen html.
href, merupakan atribut dari tag a yang digunakan untuk menentukan url dari suatu link.
title, merupakan atribut untuk memberikan informasi suatu elemen dengan tampilan tool-tip yang akan muncul saat kursor di atasnya.
src, merupakan atribut dari tag img untuk menentukan url suatu gambar, agar gambar dapat ditampilkan di halaman web.
alt, merupakan atribut dari tag img untuk membuat alternatif teks pada saat gambar tidak tampil.
width, merupakan atribut untuk mentukan lebar dari elemen.
height, merupakan atribut untuk menentukan tinggi dari elemen.
id, merupakan atribut untuk memberikan id unik suatu elemen untuk memberikan gaya hanya pada nama id tersebut.
class, merupakan atribut untuk menentukan gaya yang sama pada beberapa elemen dengan nama class yang sama.

Atribut Style, berperan dalam pengaturan tampilan agar lebih artistik. Pembahasan lebih lengkap tentang style ada dalam tutorial CSS. Penggunaan atribut style pada elemen html mengacu pada sintax <namatag style=”property:value;”>…</namatag>. Property adalah nama properti css dan value adalah nilai nama properti css-nya. Contoh: <p style=”color:red;text-align:left”>…</p>, dimana color adalah properti css dan red adalah nilai dari propertinya. Berikut ini beberapa properti css yang biasa digunakan, diantaranya:

background-color, merupakan properti untuk menentukan warna latar terhadap isi elemen dengan nilai nama-nama warna seperti red, blue, yellow, black, dll. atau dengan nilai rgb seperti rgb(255,0,0), atau dengan nilai rgba seperti rgba(255, 99, 71, 0.8), atau dengan nilai hsl seperti hsl(0, 100%, 50%), atau dengan nilai hsla seperti hsla(9, 100%, 64%, 0.8), atau dengan nilai hexadecimal seperti #ff0000. Contoh <h1 style=”background-color:#ff0000″>…</h1>.
color, merupakan properti untuk menentukan warna huruf dengan nilai warna baik nama warna, rgb, rgba, hsl, hsla atau hexadecimal. Contoh <p style=”color:blue”>…</p>.
font-family, merupakan properti untuk menentukan jenis huruf yang digunakan dengan nilai nama jenis huruf seperti arial, times new roman, georgia, helvetica, dll. Contoh <p style=”font-family:arial”>…</p>.
font-size, merupakan properti untuk menentukan ukuran huruf. Contoh <p style=”font-size:10px”>…</p>. Pemberian nilai dapat berformat px, em atau pt.
text-align, merupakan properti untuk menentukan perataan teks dengan nilai left untuk rata kiri, right untuk rata kanan, center untuk rata tengah dan justify untuk rata kiri kanan. Contoh <p style=”text-align:justify”>…</p>.
border, merupakan properti untuk memberikan border/bingkai dengan nilai ukuran ketebalan dalam px, em atau pt. Contoh <p style=”border:2px solid”>…</p>.
padding, merupakan properti untuk menentukan jarak ke dalam isi elemen. Padding terdiri atas padding-top, padding-right, padding-bottom, dan padding left dengan nilai ukuran dalam px, em atau pt. Dapat ditulis padding: 2px 1px 2px 3px; kalau nilainya sama cukup ditulis padding:2px.
margin, merupakan properti untuk menentukan jarak antar elemen. Margin terdiri atas margin-top, margin-right, margin-bottom dan margin-left dengan nilai ukuran dalam px, em atau pt. Dapat ditulis margin:2px 2px 2px 2px; atau lebih sederhana margin:2px; membacanya jarak dari atas, kanan, bawah dan kiri.

Khusus penggunaan warna mengikuti aturan berikut ini:

Nama warna diantaranya: aqua, blue, black, brown, chocolate, cyan, fuchsia, gold, grey, green, lavender, lime, magenta, maroon, navy, olive, orange, orchid, pink, purple, red, salmon, sienna, silver, tan, teal, tomato, Turquoise, violet, white, yellow, dsb.
Nilai rgb(red, green, blue), diisi dengan nilai intensitas mulai dari 0 hingga 255. Misalnya untuk warna merah rgb(255, 0, 0), warna hitam rgb(0,0,0) dan warna putih rgb(255, 255, 255)
Nilai hexadecimal, mengikuti aturan #rrggbb dengan rr adalah red, gg adalah green dan bb adalah blue dengan nilai diantara 00 hingga ff (sama dengan nilai 0-255). Contoh warna merah maka hexadecimal nya dalah #ff0000, karena diset ke nilai tertinggi yaitu ff dan lainnya diset ke nilai terendah yaitu 00. Contoh lainnya #0000ff, #3cb371, #ee82ee, #ffa500, #6a5acd, dsb.
Nilai hsl(hue, saturation, lightness), hue diisi dengan nilai derajat mulai 0 hingga 360, misalnya 0 untuk red, 120 untuk green, dan 240 untuk blue. Saturation diisi dengan nilai persentasi antara 0% hingga 100%, dimana 0% untuk grey dan 100% untuk full collor. Lightness diisi juga dengan nilai persen antara 0% hingga 100%, dimana 0% untuk hitam, 50% sedikit terang, dan 100% untuk putih. Contoh hsl(0, 100%, 50%), hsl(240, 100%, 50%).
Nilai rgb(red, green, blue, alpha), dengan r, g dan b diisi dengan nilai intensitas mulai dari 0 hingga 255. Sedangkan alpha antara 0.0 untuk full transparan hingga 1.0 untuk tidak transparan. Contoh rgba(255, 99, 71, 0), rgba(255, 99, 71, 0.2), rgba(255, 99, 71, 0.6), rgba(255, 99, 71, 1), dsb.
Nilai hsla(hue, saturation, lightness, alpha), hue diisi dengan nilai derajat mulai 0 hingga 360. Saturation diisi dengan nilai persentasi antara 0% hingga 100%, dimana 0% untuk grey dan 100% untuk full collor. Lightness diisi juga dengan nilai persen antara 0% hingga 100%, dimana 0% untuk hitam, 50% sedikit terang, dan 100% untuk putih. Sedangkan alpha antara 0.0 untuk full transparan hingga 1.0 untuk tidak transparan. Contoh hsla(9, 100%, 64%, 0), hsla(9, 100%, 64%, 0.2), hsla(9, 100%, 64%, 0.6), hsla(9, 100%, 64%, 1), dsb.

Demikianlah tutorial tentang Penggunaan Style dan Atribut dalam Elemen HTML. Beberapa hal yang harus diperhatikan adalah dalam penulisan nama tag, atribut dan propert dan nilainya direkomendasikan menggunakan huruf kecil semua, dan juga direkomendasikan menggunakan tanda petik ganda untuk mengapit nilai dari atribut atau nilai dari properti.

Apa saja elemen elemen HTML?

Tag, elemen, dan atribut merupakan tiga bagian penting yang ada di dalam HTML..

<! DOCTYPE html> — untuk deklarasi type dokumen;.

<html> — tag utama dalam HTML;.

<head> — untuk bagian kepala dari dokumen;.

<title> — untuk judul web;.

<body> — untuk bagian body dari dokumen..

Atribut HTML apa saja?

Atribut href. Atribut href dipakai pada link (tag a). ... .

Atribut src. Atribut src dipakai pada image (tag img). ... .

Atribut width dan height. Atribut width dan height dipakai pada tag img. ... .

Atribut sytle. Atribut style dapat dipakai pada hampir semua tag HTML. ... .

Atribut title. ... .

Cara Penulisan Atribut..

Apa itu atribut global?

Deskripsi. Mengenai Global Attributes Global Attributes merupakan attribute yang digunakan untuk semua element HTML, meskipun atribut tersebut tidak memiliki peranan (pengaruh) terhadap beberapa element. Global Attribute bisa saja digunakan pada sebuah element yang bukan standar.

Apa kegunaan atribut style pada HTML?

</style> yang digunakan untuk menyisipkan kode css dalam dokumen HTML. Mencakup pembahasan lebih detail dan lengkap yang disertai contoh kode penggunaan sebagai rujukan untuk materi belajar HTML elemen <style>.