Jadval, iqtibos va klaviatura mashqi

DarslarWeb dasturlash

Jadval, iqtibos va klaviatura mashqi

HTMLda jadval tuzish, jadvalga oddiy ko'rinish berish, iqtibos (quotation) teglari va typing.com orqali tezkor yozishni mashq qilish.

25 daqiqa
HTML — Dars 3

Jadval, iqtibos va klaviatura mashqi

Jadval yaratishni, iqtiboslar qo'yishni va tez yozishni o'rganasiz.

<table><tr><td><blockquote>

Dars rejasi

4 ta mavzu
  1. 01Jadval — <table>, <tr>, <td>
  2. 02Jadvalga ko'rinish berish
  3. 03Iqtiboslar — <blockquote>, <q>
  4. 04typing.com — klaviatura mashqi

1. Jadval — <table>

Jadval — bu qator va ustunlardan iborat ma'lumot. Masalan, dars jadvali, narxlar ro'yxati yoki futbol turniri jadvali.

HTMLda jadval 3 ta asosiy tegdan yasaladi:

  • <table> — butun jadvalni o'rab turadi.
  • <tr> (table row) — bitta qator.
  • <td> (table data) — qator ichidagi bitta katak.
1<table>
2 <tr>
3 <td>Olma</td>
4 <td>15 000 so'm</td>
5 </tr>
6 <tr>
7 <td>Nok</td>
8 <td>20 000 so'm</td>
9 </tr>
10</table>
1<table>
2 <tr>
3 <th>Mahsulot</th>
4 <th>Narxi</th>
5 </tr>
6 <tr>
7 <td>Olma</td>
8 <td>15 000 so'm</td>
9 </tr>
10</table>
Jadvalni sinang
Natijajonli

2. Jadvalga ko'rinish berish

Oddiy <table> tegining chegarasi (border) ko'rinmaydi. Uni ko'rinadigan qilish uchun border atributini qo'shamiz:

1<table border="1">
2 <tr><td>1</td><td>2</td></tr>
3 <tr><td>3</td><td>4</td></tr>
4</table>

Hozir esa ko'rinishni boshqarish uchun style atributidan foydalanamiz. U bilan rang, chegara va ichki bo'shliqni sozlash mumkin:

1<table style="border-collapse: collapse;">
2 <tr>
3 <th style="border: 1px solid black; padding: 8px;">Ism</th>
4 <th style="border: 1px solid black; padding: 8px;">Yosh</th>
5 </tr>
6 <tr>
7 <td style="border: 1px solid black; padding: 8px;">Ali</td>
8 <td style="border: 1px solid black; padding: 8px;">20</td>
9 </tr>
10</table>
Chiroyliroq jadval
Natijajonli

3. Iqtiboslar (quotations)

Iqtibos — bu boshqa birovdan keltirilgan gap. HTMLda ikki xil iqtibos tegi bor: <blockquote> (katta, alohida blok) va <q> (qisqa, matn ichida).

<blockquote> — katta iqtibos

Katta iqtibos uchun ishlatiladi. Brauzer uni avtomatik chetga surib qo'yadi, shuning uchun yaqqol ajralib turadi.

1<blockquote>
2 Bilim — eng katta boylik. Uni hech kim olib qo'ya olmaydi.
3</blockquote>

<q> — qisqa iqtibos

Matn ichida kichik iqtibos uchun ishlatiladi. Brauzer uni avtomatik qo'shtirnoq ichiga oladi.

1<p>Ustozim aytgan edi: <q>Har kuni kamida 1 soat mashq qil.</q></p>
Iqtiboslarni sinang
Natijajonli

4. Klaviatura mashqi — typing.com

Dasturchi bo'lishni boshlagan ekansiz, klaviaturadan tez va to'g'ri foydalana olish juda muhim. Kod yozishda har bir soniya qimmat. Shu sababli biz har darsdan oldin 10 daqiqa klaviatura mashqi qilamiz.

  1. typing.com saytiga kiring va ro'yxatdan o'ting (Sign Up).
  2. «Learn» bo'limiga o'tib, birinchi darsni boshlang.
  3. Barmoqlaringizni to'g'ri joylashtirishga e'tibor bering (ko'rsatma bor).
  4. Klaviaturaga qaramasdan yozishga harakat qiling — bu eng muhimi.

Kichik test

0 / 4

1.Jadvalning bitta qatori qaysi teg bilan yaratiladi?

2.Jadvalning sarlavha katagi qaysi teg bilan yoziladi?

3.Katta iqtibos uchun qaysi teg ishlatiladi?

4.typing.com saytidagi mashqning asosiy maqsadi nima?

Mustaqil ish

0 / 6