Ommabop HTML-teglar

4.1 Teglar a, href

Xo'sh, biz seni Java dasturchi qilish niyatidamiz, shuning uchun senga atigi 5 ta tegni o'rganishga to'g'ri keladi.

Birinchidan, bu eng muhim teg bo'lib, matnni gipermatnga aylantiradi – havola. HTMLda havolalar yaratish uchun <a> (anchor, yakor) tegi ishlatiladi.

Standart havola quyidagicha ko'rinishga ega:

        <a href="havola-manzili">havola matni</a>
    

Bu yerda moviy rangda foydalanuvchi ko'radigan matn, yashil rangda esa foydalanuvchi matnga bosganida o'tadigan manzil (havola) ko'rsatiladi.

Tipik HTML hujjati, havolalar o'z ichiga olgan quyidagicha ko'rinishga ega:

<html>
    Oddiy matn
 <a href="http://javarush.com/about">
            Qiziqarli narsaga havola
 </a>
     yana biror matn
</html>

Xo'sh, odatda bu quyidagicha ko'rinadi:

<html>
    Oddiy matn  <a href="http://javarush.com/about">Qiziqarli narsaga havola</a> yana biror matn
</html>

Dunyo ideal emas.

4.2 Teg img va atribut src

HTML sahifasiga rasm qo'shish uchun <img> (image so'zidan) tegi ishlatiladi. Bu yakka teg bo'lib, yopilish tegi yo'q. Tegning umumiy ko'rinishi:

        <img src="rasmga havola">
    

Hamma narsa juda oddiy. HTML hujjatingizda rasmni ko'rsatish uchun faqat rasmga havolani bilish va img tegini ishlatish zarur. Sinab ko'r, o'zingizga yoqadi.

4.3 Element table

Shuningdek HTML sahifasi ma'lumotlar jadvalini ham o'z ichiga olishi mumkin. Lekin buni bitta teg bilan hal qilib bo'lmaydi, o'ylab ko'ring. Axir jadvalda sarlavha, qatorlar, ustunlar va hujayralar mavjud. Ularning har biri uchun o'z teglar o'ylab topilgan:

• <table> – jadvalning o'zi;
• <tr> (table row) – jadvalning qatori;
• <th> (table header) – jadval sarlavha hujayrasi;
• <td> (table data) – jadval hujayrasi.

Mana 3x3 jadval htmlda qanday ko'rinishga ega bo'ladi (qo'shimcha sarlavha qatori bilan):

<table>
 <tr> <th>Familiya</th> <th>Ism</th> <th>Otasining ismi</th> </tr>
 <tr> <td>Ivanov</td> <td>Ivan</td> <td>Ivanovich</td> </tr>
 <tr> <td>Petrov</td> <td>Petr</td> <td>Petrovich</td> </tr>
 <tr> <td>Sidorov</td> <td>Kola</td> <td>Sidorenko</td> </tr>
</table>

Hozirda jadval kamdan-kam ishlatiladi. Buning sababi shundaki, telefon orqali sahifani ko'rib chiqishda, jadvalni boshqa tarzda ko'rsatish foydali bo'lishi mumkin (u ekranga sig'maydi). Lekin jadvalning qanday tuzilganini bilishing hali ham kerak.

4.4 Atributlar id va name

Yana ikki muhim nuqta - bu id va name atributlari. Bu atributlar, teglar emas, lekin ular juda tez-tez qo'llaniladi.

Tegning id atributi unga nom berishga imkon beradi, butun hujjatda unikal. HTML hujjatida JavaScript mavjud bo'lib, bu tegning qiymati yoki parametrlarini o'zgaritadi. Unikal id yordamida kerakli tegni aniq topish mumkin.

name atributi ham shunga o'xshash vazifani bajarsa-da, uning qiymati sahifadagi boshqa joylarda takrorlanishi mumkin. Ya'ni, bir necha bir xil nomli teglar bo'lishi mumkin. Bu elementlar guruhi bilan ishlashda qulaylik yaratadi.

Masalan, sahifada bir nechta ro'yxatlar mavjud va har birida faqat bitta elementni tanlash mumkin. Ro'yxatda yangi elementni tanlaganda, shu ro'yxatning boshqa elementlaridagi tanlovni tozalab qo'yish kerak. Boshqa ro'yxatlarga esa tegmaslik kerak. Agar bir ro'yxatdagi barcha elementlar bir xil nomlarga ega bo'lsa, buni osongina amalga oshirish mumkin.

Har qanday tegda bir vaqtning o'zida id va name atributlari bo'lishi mumkin. Misol:

<img id="image123" name="avatar" src="rasmga havola">