HTML atributlari

HTML atributlari HTML elementlari haqida qoshimcha ma'lumot beradi.

HTML atributlari haqida

Barcha HTML elementlari attributlarga ega bolishi mumkin
Attributlar elementlar haqida qoshimcha ma'lumot beradi
Attributlar har doim ochilish tegida korsatiladi
Attributlar odatda name/value juftligi sifatida yoziladi: name="value"

`href` atributi

<a> teg gipermurojaat (hyperlink) yaratadi. href atributi link qaysi URLga olib borishini korsatadi:

Misol

html

<a href="https://www.w3schools.com">W3Schools saytiga tashrif buyuring</a>

Linklar haqida batafsilroq HTML Links bobida korsatilgan.

`src` atributi

<img> teg HTML sahifasiga rasm joylashtirish uchun ishlatiladi. src atributi korsatiladigan rasmning manzilini belgilaydi:

Misol

html

<img src="/img_girl.jpg">

src atributida URLni korsatishning ikki usuli mavjud:

1. Absolyut URL - Boshqa saytga joylangan rasmga ulanadi. Misol: src="https://www.w3schools.com/images/img_girl.jpg".

Eslatma: Tashqi rasmlar mualliflik huquqi ostida bolishi mumkin. Ruxsat olmasangiz qonuniy muammolarga duch kelishingiz mumkin. Shuningdek, tashqi rasmni nazorat qila olmaysiz; u birdan oʻchirilishi yoki oʻzgartirilishi mumkin.

2. Nisbiy (relative) URL - Sayt ichiga joylangan rasmga ulanadi. Bu holatda URL domen nomini oz ichiga olmaydi. Agar URL boshida slash (/) bolmasa, u hozirgi sahifaga nisbatan hisoblanadi. Misol: src="img_girl.jpg". Agar URL boshida slash bolsa, u domen asosida hisoblanadi. Misol: src=img_girl.jpg".

Maslahat: Aksariyat hollarda nisbiy URLlardan foydalanish yaxshiroq. Domenni ozgartirsangiz ular sinmaydi.

`width` va `height` attributlari

<img> tegda width va height attributlari ham bolishi kerak; ular rasmning kengligi va balandligini (pikselda) korsatadi:

Misol

html

<img src="/img_girl.jpg" width="500" height="600">

`alt` atributi

<img> tegida majburiy alt atributi rasm korsatilmasa yoki yuklanmasa ekranga chiqariladigan muqobil matnni belgilaydi. Bu sekin boglanish, src atributidagi xato yoki screen reader (ekran oquvchi) foydalanuvchisi uchun muhimdir.

Misol

html

<img src="/img_girl.jpg" alt="Jaket kiygan qiz">

Misol (rasm topilmasa)

Quyidagi misolda rasm mavjud bolmasa nima bolishini korsatasiz:

html

<img src="img_typo.jpg" alt="Jaket kiygan qiz">

Rasmlar haqida batafsilroq HTML Images bobida korsatilgan.

`style` atributi

style atributi elementga rang, shrift, oʻlcham va boshqa uslublarni qoʻshish uchun ishlatiladi.

Misol

html

<p style="color:red;">Bu qizil paragraf.</p>

Uslublar haqida batafsilroq HTML Styles bobida korsatilgan.

`lang` atributi

<html> tegida lang atributini har doim korsatishingiz kerak; bu sahifaning tilini eʼlon qiladi va qidiruv tizimlari hamda brauzerlarga yordam beradi.

Quyidagi misol sahifa tilini inglizcha deb belgilaydi:

html

<!DOCTYPE html>
<html lang="en">
<body>
...
</body>
</html>

Til kodiga mamlakat kodi ham qoʻshilishi mumkin. Birinchi ikki belgilar sahifa tilini, oxirgi ikki belgilar esa mamlakatni bildiradi.

Quyidagi misol sahifani ingliz tili va AQSh uchun belgilaydi:

html

<!DOCTYPE html>
<html lang="en-US">
<body>
...
</body>
</html>

Barcha til kodlarini HTML Language Code Reference boʻlimida korsatganmiz.

`title` atributi

title atributi element haqida qoʻshimcha ma'lumot beradi.

title atributi qiymati element ustiga kursor olib borilganda tooltip sifatida korsatiladi:

Misol

html

<p title="Bu mening tooltipim">Bu paragraf.</p>

Maslahat: Attribut nomlarini kichik harflarda yozishni tavsiya qilamiz

HTML standarti attribut nomlarini kichik harflarda yozishni majburiy emas deb hisoblaydi.

title atributi (va boshqa attributlar) katta yoki kichik harflarda yozilishi mumkin: title yoki TITLE.

Ammo W3C HTMLda kichik harflarni tavsiya qiladi va qatʼiyroq hujjat turlari (masalan XHTML) uchun kichik harflarni talab qiladi.

TIP

W3Schoolsda biz har doim attribut nomlarini kichik harflarda yozamiz.

Maslahat: Attribut qiymatlarini har doim qavs ichida yozing

HTML standarti attribut qiymatlarini qavs ichida yozishni majburiy deb hisoblamaydi.

Ammo W3C HTMLda qavslarni tavsiya qiladi va qatʼiyroq hujjat turlari (XHTML) uchun qavslarni talab qiladi.

Yaxshi:

html

<a href="https://www.w3schools.com/html/">HTML darsligimizga tashrif buyuring</a>

Yomon:

html

<a href=https://www.w3schools.com/html/>HTML darsligimizga tashrif buyuring</a>

Baʻzi hollarda qavslar kerak boladi. Quyidagi misol title atributi ichida boʻsh joy mavjudligi sababli toʻgʻri korsatilmaydi:

Misol

html

<p title=Description of W3Schools>

TIP

W3Schoolsda biz har doim attribut qiymatlarini qavs ichida yozamiz.

Bir yoki ikki tirnoq?

Attribut qiymatlarini ikki tirnoq ichida yozish HTMLda eng keng tarqalgan usul, ammo bir tirnoq ham ishlatilishi mumkin.

Agar atribut qiymati ichida ikki tirnoq mavjud bolsa, qiymatni bir tirnoq ichida yozish kerak:

html

<p title='John "ShotGun" Nelson'>

Yoki aksincha:

html

<p title="John 'ShotGun' Nelson">

Bob xulosasi

Barcha HTML elementlari attributlarga ega bolishi mumkin
<a> ning href attributi link qaysi sahifaga olib borishini korsatadi
<img> ning src attributi korsatiladigan rasmning manzilini belgilaydi -- <img> ning width va height attributlari rasm oʻlchamini belgilaydi -- <img> ning alt attributi rasm uchun muqobil matn beradi style attributi elementga rang, shrift, oʻlcham va boshqa uslublarni qoʻshish uchun ishlatiladi -- <html> tegidagi lang attributi sahifaning tilini eʼlon qiladi -- title attributi element haqida qoʻshimcha ma'lumot beradi

HTML Attribute Reference

INFO

Har bir HTML elementi uchun mavjud attributlarning toʻliq roʻyxati HTML Attribute Reference boʻlimida keltirilgan.

HTML atributlari ​