• Kasblar
    • HTML
    CSS
    JavaScript
    PHP
    SQL
    Python
  • Bo'limlar
    • Yangiliklar
    Texnologiyalar
    Maqolalar

    Attributlar

    HTML attributlar -  ​HTML elementlarga qo'shimcha ma'lumot beruvchi qismlar.

    HTML attributlar

    • Har qanday HTML element attributlarga ega bo'lishi mumkin.
    • HTML elementlarga qo'shimcha ma'lumot beradi.
    • Attributlar doim HTML elementning boshlovchi tegida joylashtiriladi.
    • Attributlar odatda nom/qiymat juftliklari ko'rinishida keladi :  attribut-nomi="qiymat"

     

    href attributi

    <a> tegi hovolalarni (linklarni) yaratishda ishlatiladi. href attributi esa boshqa sahifaning URL(Universal Resource Locator) manzilini o'zida saqlaydi.

    Namuna

    <!DOCTYPE html>
<html>
<body>

<a href="google.com">Google sahifasini ochish</a>

</body>
</html>

    Natija

    Google sahifasini ochish

    src attributi

    <img> tegi sahifaga rasmni ko'rsatishda  ishlatiladi. src attributi esa ko'rsatilgan rasmning manzilini bildiradi.

    Namuna

    <!DOCTYPE html>
<html>
<body>

<img src="https://picsum.photos/id/1/200/300" >

</body>
</html>

    Natija

    width va height attributlari

    <img> tegi o'zida width va height attributlarini ham saqlashi kerak.  width rasmning  kengligini, height esa balandligini bildiradi.

    Namuna

    <!DOCTYPE html>

    <html>

    <body>

    <img src="https://picsum.photos/seed/picsum/200/300" width="140" height="160" >

    </body>

    </html>

    alt attributi

    <img> tegi o'zida majburiy alt attributini saqlashi kerak.  

    alt rasm internet sekin ishlaganda, yoki umuman aloqa uzilib qolgan taqdirda rasm yuklanmay qoladigan payt sahifada rasm o'rnida chiqadigan yozuvdir.

    <!DOCTYPE html>

    <html>

    <body>

    <img src="https://picsum.photos/seed/picsum/200/300" alt="Bu aniq rasm">

    </body>

    </html>

    style Attribute

    style atributi elementga rang, shrift, o'lcham va boshqa  stillarni  qo'llash uchun ishlatiladi.

    style attributi haqida hali darslar davomida gaplashamiz.

    Namuna

    <!DOCTYPE html>
<html>
<body>

  <p style="color: red; font-size:20px"> Salom. Bu p elementi  </p>

</body>
</html>

    Natija

    Salom. Bu p elementi

    Title Attribute

    title attributi element haqida qo'shimcha ma'lumotlarni berish uchun ishlatiladi.

    Title attributidagi  qiymat  foydalonuvchi elementning ustiga sichqonchani olib borsa ko'rsanadi.

    Namuna

    <!DOCTYPE html>
<html>
<body>

<p title="Voooooy"> Qani sichqonchani olib kelchi.</p>

</body>
</html>

    Natija

    Qani sichqonchani olib kelchi.

    Tavsiya etiladi

    har doim kichik harflardan foydalaning

    HTML  da attributlarni  kichik xarflarda  yozishda talab qilmaydi.

    Barcha  attributlarni kichik yoki katta xarflarda yozish mumkin masalan  tittle  yoki  TITLE.

    Ammo  attributlarni kichik xarflarda yozishni tafsiya etadi.

     

    Har doim Atribut qiymatlarini qo'shtirnoq bilan kiriting

    HTML da atribut qiymatlari atrofida qo'shtirnoqlarni (" ") talab qilmaydi.

    Ammo   attribute qiymatlarini qo'shtirnoq ichida yozish tavsiya etiladi.

    Yaxshi yondashuv

    
<!DOCTYPE html>
<html>
<body>

<a href="https://www.w3schools.com/html/">Visit our HTML tutorial</a>

</body>
</html>

     

    Bir yoki ikkitalik qoshirnoq (' ' , " " )

    Atribut qiymatlari atrofida  ikkitalik qo'shtirnoq qo'yish HTML - da eng keng tarqalgan, ammo bittalik qo'shtirnoqlardan  ham foydalanish mumkin.

    Ba'zi holatlarda, agar atribut qiymati o'z ichiga ikkitalik qo'shtirnoqli so'z qoshmoqchi  bo'lsa, ichki qismda bittalik qo'shtirnoqdan foydalanish kerak bo'ladi:

     

    <!DOCTYPE html>
<html>
<body>
  
  <p title='John "ShotGun" Nelson'>ichki qismda ikkita tirnoq (" ")<p>
  <p title="John 'ShotGun' Nelson">ichki qismda ikkita tirnoq (' ')</p>
  
</body>
</html>

    Natija

    ichki qismda ikkita tirnoq (" ")

    ichki qismda ikkita tirnoq (' ')