#HTML #CSS #WebDasturlash #Frontend #Dasturlash #Tables #LearnToCode
๐ @absJavaScript | #JaSc@absJavaScript
7. HTML Jadval (Table) Yaratish
๐ @absJavaScript | #JaSc@absJavaScript
โคโ๐ฅ2๐ฅ2๐1
#HTML #CSS #WebDasturlash #Frontend #Dasturlash #Tables #LearnToCode
Darsni davom etamizโฆ
Agar siz "ma'lumotlarni tartibli" koโrinishda aks ettirmoqchi boโlsangiz, "HTML jadvallari (tables)" dan foydalanishingiz mumkin. Bugun "HTML jadval yaratish" va "asosiy teglarini" oโrganamiz!
๐ HTML jadvalining tuzilishi
Jadval
๐ Amaliy misol
๐ Izoh:
โ
โ
โ
โฎ Avvalgi postda "HTML formlar โ Foydalanuvchi kiritmalarini qanday olamiz?" yoritilgan.
โญ Keyingi postda "CSS Asoslari โ Veb-sahifalarni Chiroyli Qilish" yoritiladi
๐ @absJavaScript | #JaSc@absJavaScript
7. HTML Jadval (Table) Yaratish
Agar siz "ma'lumotlarni tartibli" koโrinishda aks ettirmoqchi boโlsangiz, "HTML jadvallari (tables)" dan foydalanishingiz mumkin. Bugun "HTML jadval yaratish" va "asosiy teglarini" oโrganamiz!
Jadval
<table> tegi yordamida yaratiladi va quyidagi elementlardan iborat boโladi.๐ Amaliy misol
<!DOCTYPE html>
<html lang="uz">
<head>
<meta charset="UTF-8">
<title>HTML Jadval</title>
<style>
table {
width: 100%;
border-collapse: collapse;
}
th, td {
border: 1px solid black;
padding: 10px;
text-align: center;
}
th {
background-color: #f4f4f4;
}
</style>
</head>
<body>
<h2>Oโquvchilar Roโyxati</h2>
<table>
<tr>
<th>#</th>
<th>Ism</th>
<th>Yosh</th>
</tr>
<tr>
<td>1</td>
<td>Ali</td>
<td>18</td>
</tr>
<tr>
<td>2</td>
<td>Bekzod</td>
<td>20</td>
</tr>
</table>
</body>
</html>
๐ Izoh:
โ
<th> โ jadval ustunlari uchun sarlavha beradi.โ
<td> โ oddiy katak (maโlumot joylashadi).โ
border-collapse: collapse; โ chegaralarni birlashtirib, yaxlit koโrinish hosil qiladi.โฎ Avvalgi postda "HTML formlar โ Foydalanuvchi kiritmalarini qanday olamiz?" yoritilgan.
โญ Keyingi postda "CSS Asoslari โ Veb-sahifalarni Chiroyli Qilish" yoritiladi
๐ @absJavaScript | #JaSc@absJavaScript
โค2โคโ๐ฅ2โก1