|
Bo’lim xulosasi
HTML ![]() ni rasmni aniqlashda ishlatiladi
HTML src attributi rasm adresini aniqlaydi
HTML alt attributi rasm
HTML width and height attributlari rasm hajmini aniqlaydi
CSS width and height rasm hajmini aniqlaydi
CSS float rasm chap yoki o’ng yoniga paragraf qo’yish uchun ishlatiladi
HTML elementi rasm kartasi hisoblanadi
HTML elementi rasmning bosiladigan qismiga ishlatiladi
... Rasmlarni yuklash birmuncha vaqt oladi. Katta hajmdagi rasmlar sahifa yuklanishini sekinlashtiradi. Shuning uchun rasmlardan ehtiyotkorlik bilan foydalaning.
HTML Jadval
Tartib raqami
|
Ismi
|
Familiyasi
|
Natijalar
|
1
|
Marlyn
|
Monroe
|
95
|
2
|
James
|
Bond
|
98
|
3
|
David
|
Beckham
|
48
|
4
|
Javokhir
|
Kudratov
|
90
|
Namuna:
HTML Jadvalini Ifodalash
Will |
Smith |
50 |
Micheal |
Jackson |
94 |
Namunaga Izohlar:
Jadvallar tegi bilan belgilanadi.
Jadvallar tegi yordamida qatorlarga bo'linadi.
Jadval qatorlari tegi orqali jadval ma'lumotlariga bo'linadi;
Shuningdek jadval qatori | tegi bilan jadval sarlavhasini yozish mumkin.
... | jadval ma'lumotlari jadvalning konteyneri hisoblanadi.
Ular turli xildagi ma'lumotlarni o'z ichiga oladi misol uchun matn, rasmlar, ro’yxatlar, boshqa jadvallar va h.k.
HTML Jadvali Border Atributi Bilan
Agar siz jadvalning chegaralarini aniqlamasangiz, jadval chegarasiz ko'rsatiladi. Chegaralar quyidagi atribut orqali qo'shiladi:
Namuna:
Bruno |
Mars |
50 |
Bob |
Marley |
94 |
... border atributi HTML standardlariga to’g’ri kelmaydi. border atributini yaxshisi CSS da ishlatilgani ma’qul.
Border(chegara) kiritish uchun, CSS border xususiyatidan foydalaning:
Namuna:
table, th, td {
border: 1px solid black;
}
HTML Jadvalida Collapsed Borders
Agar siz jadval chegaralari faqat chiziq holatida bo’lishini hohlasangiz CSS border-collapse atributini ishlating
Namuna:
table, th, td {
border: 1px solid black; border-collapse: collapse;
}
HTML jadvalda Cell Padding
Jadval chegarasidan yozuvgacha bo’lgan masofani o’rnatish, agar o’rnatilmasa, yozuv jadval chegarasiga yopishib yoziladi.
padding o'rnatish uchun, CSS padding xususiyatidan foydalaning:
Namuna:
table, th, td {
border: 1px solid black; border-collapse: collapse;
}
th, td {
padding: 15px;
}
HTML Jadval Sarlavhasi
Jadval sarlavhasi | tegi bilan aniqlanadi.
Deyarli barcha asosiy browserlar jadval sarlavhasini qalin va markazda ko’rsatadi.
Namuna:
Ismi |
Familiyasi |
Ballari |
Sarvarkhuja |
Murodov |
94 |
Teg ichidagi qatorlarni chapga tekislash uchun,CSS text-align xususiyatidan foydalaning:
Namuna:
th {
text-align: left;
}
HTML Jadvallarida Chegara Oralig’i
Chegara oralig’i yacheykalar orasidagi oraliq belgilaydi.
Jadvalda chegara oralig’i o’rnatish uchun, CSS border-spacing ni ishlatamiz.
Namuna:
table {
border-spacing: 5px;
}
... Agar jadval chegalari buzilsa, chegara-oralig’ini ta’siri yo’q.
Bir Qancha Ustunlarni Umumiy Katakga Joylash
Buning uchun, colspan atributidan foydalanamiz:
Namuna:
Ismi |
Telephone |
Bill Gates |
555 77 854 |
555 77 855 |
Bir Qancha Ustunni Jadval Yacheykalari Ichiga Qo’yish
Yacheykaga bittadan ko’p ustunni qo'yish uchun colspan atributidan foydalaniladi:
Namuna:
Name: |
Steve Jobs |
Telephone: |
555 77 854 |
555 77 855 |
HTMLda Yaratilgan Jadvalga Nom Berish
Jadvalga izoh qo’shish uchun, tegidan foydalaniladi:
Namuna:
Monthly savings
Oy |
Daromad |
Yanvar |
$100 |
Fevral |
$50 |
... tegidan so’ng darhol tegi ishlatilishi kerak.
Jadval Uchun Maxsus Ko’rinish
Jadvalda maxsus ko’rinishini aniqlash uchun, jadvalga bir id atributini qo’shish kerak:
Namuna:
>
Ismi |
Familiyasi |
Ballari |
Mishel |
Jackson |
94 |
CSS faylida siz jadval ko’rinishini belgilashingiz mumkin:
table#t01 {
width: 100%;
background-color: #f1f1c1;
}
Va yana boshqa stillarni qo’shishingiz mumkin:
table#t01 tr:nth-child(even) { background-color: #eee;
}
table#t01 tr:nth-child(odd) { background-color: #fff;
}
table#t01 th {
color: white; background-color: black;
}
Bo’lim xulosasi:
HTML elementi jadval kiritishda ishlatiladi
HTML elementi qator kiritishda ishlatiladi
HTML elementi jadvaldagi ma'lumotlarni kirishda ishlatiladi.
HTML | element to jadval boshini bildiradi
HTML elementi hadval sarlavhasini qo'yishda ishlatiladi
CSS border jadval chegarasini aniqlashda ishlatiladi
CSS border-collapse jadval chegarsini chiziq holatida ko'rsatadi
CSS padding jadval kengligini o'zgartirishda yordam beradi.
CSS text-align jadvaldagi matnlarni qaysi tomondan boshlanishida ishlatiladi.
CSS border-spacing yacheykalar orasidagi oraliqni belgilaydi
colspan attributi bitta umumiy ustun qiladi
rowspan attributi bitta umumiy qator qilishda ishlatiladi.
id attributi jadvalning yagona ekanligini bildiradi.
HTML Bloklar
HTMLdagi har bir elementining turiga qarab standart ko’rinish qiymati bo’ladi. Ko’p elementlar uchun standard ko’rsatsh qiymati block yoki inline.
Block-level Elementlari
Block-level elementlari har doim yangi qatordan boshlanib mavjud bo'lgan joygacha to'ladi.(Chapdan o'nggacha barcha bo'sh joyni to'ldiradi)
The elementi block-level elementi hisoblanadi. Block-level elementlariga namunalar:
| | |
