O’ZBEKISTON RESPUBLIKASI OLIY VA O`RTA MAXSUS
TA’LIM VAZIRLIGI
BUXORO DAVLAT UNIVERSITETI
Fizika –matematika fakulteti
“Axborot texnologiyalari” kafedrasi
“Kompyuter grafikasi va web dizayn”
fanidan
Mavzu:
HTML hujjatining strukturasi va undagi mantnni formatlash teglari,
umumiy teglar ularning atributlari.
Bajardi:
Murodova Sh.
Qabul qildi:
Xayatov X.
Buxoro-2016
Mavzu:
HTML hujjatining strukturasi va undagi mantnni formatlash teglari,
umumiy teglar ularning atributlari.
Reja:
1. HTML asoslari.
2. HTML xujjatining tuzilishi.
3. Matnlarni bezash va formatlash.
4. Bazi bir forma teglari va ularning atributlari.
5. HTMLdagi asosiy teglar.
HTML asoslari.
Internet - sayyoramiz miqyosidagi kompyuter tarmoqlarining birlashmasidir.
Agar kosmik stanstiya a’zolarining E-mail dan foydalanishini inobatga olsak
internetning sayyoramiz sarhadlaridan chiqqanini ham ko’rishimiz mumkin.
Butun dunyo o’rgimchak to’ri WWW (World Wide Web) - bu ko’p sonli
o’zaro bir-biriga bog’langan hujjatlardir. Web sahifada boshqa Web sahifalar bilan
bog’lovchi chekli gipermurojaat bo’ladi. Gipermurojaat mexanizmini bir necha
so’z bilan izohlash qiyin, lekin kamida bir marta Web sahifaga kirib ishlagan odam
buni darhol tushunadi.
Gipermurojaat butunjahon o’rgimchak to’ridan hujjatning URL deb
nomlanuvchi manzilini qidirishda ishlatiladi. Biz bilamizki Web sahifaning asosiy
mohiyati axborotni tacvirlash va uni har bir foydalanuvchi uchun ochib berishdir.
Bunda bir qancha funkstional cheklanishlar mavjud, ya’ni biz oldindan Web
sahifani ko’ruvchining kompyuteri qanday, monitorining imkoniyati qanday va
ko’rish oynasining qanday o’lchamda o’rnatilganligini bilmaymiz. Biz hattoki
foydalanuvchining qanday operastion muhitda ishlayotganini ham bilmaymiz. Web
sahifa esa INTEL mashinada ham Makentoshda ham bir xil ko’rinishda bo’lishi
kerak. Foydalanuvchi o’z operastion muhitida qanday yozuv shriftlar o’rnatganligi
yoki uning videokartasi qancha rangni ko’tara olishi ham malum emas. Yuqoridagi
malumotlarning yo’qligi yoki etarli emasligi umumaxborot almashish tilining
paydo bo’lishiga to’siq bo’lishi kerak edi, lekin bunday bo’lmadi.
Gap shundaki 1986 yili xalqaro standartlashtirish tashkiloti (ISO) tomonidan
qog’ozdagi hujjatni ekranda tasvirlash imkonini beruvchi hamma variantlarni
etiborga olgan SGML (Standart Generalired Markup Language) tili yaratildi.
Hamma imkoniyatlarni etiborga olgan kuchli sistema ishlab chiqildi.
Web sahifa uchun bu yaxshi yo’l deb hisoblangan edi. Lekin bu til qonun
qoidalari izohi yuzlab sahifalarni egalladi. Bunday til asosida yaratilgan sahifani
tasvirlovchi dasturni ishlab chiqish uchun juda ko’p vaqt ketgan bo’lardi, shuning
uchun Internet ehtiyoji uchun SGML tilining malum bir qismi tanlab olindi va
HTML (Hyper Text Markup Language) deb nomlandi. HTML tilida yozilgan Web
sahifa faylida axborotning qanday tasvirlanishi haqidagi yo’l yo’riqlar ketma – ket
joylashgan bo’ladi. Bu fayl oddiy matnli fayl bo’lib uni maxsus brauzer
datsturlarsiz o’qish qiyin. Grafik rasmlarni esa umumman ko’rib bo’lmaydi chunki
uning o’rnida brauzer dasturga biror rasm kerakligini ko’rsatuvchi TEG turadi.
Agar biz o’z Web sahifamizni yaratmoqchi bo’lsak, albatta HTML tilini yaxshi
bilishimiz kerak bo’ladi.
HTML ning konstrukstiyasi TEG lar deyiladi. Brauzer TEG larni oddiy
matnlardan farqlashi uchun ular burchak qavslarga olinadilar. TEG tasvirlash
jarayoni hatti harakatlarining boshlanishini bildiradi. Agar bu harakat butun
hujjatga talluqli bo’lsa, bunday teg o’zining yopiluvchi juftiga ega bo’lmaydi. Juft
teglarning ikkinchisi birinchisining harakatini yakunlaydi. Masalan, har bir Web
sahifa tegi bilan boshlanib tegi bilan yopilishi kerak. Etibor
bergan bo’lsangiz yopiluvchi teg ochiluvchidan « / » belgisi bilan farq qiladi. Teg
nomlari katta yoki kichik harflar bilan yozilishi mumkin, bularni brauzer bir xil
qabul qiladi. HTML tilida boshqa kompyuter tillaridagi kabi izoh berish imkoniyati
mavjud. Izoh quyidagi «<- - » va «- ->» belgilar orsiga yoziladi.
Masalan:
<-- Bu izox -->
Har qanday Web sahifa ikkita qismdan tashkil topadi. Bular sarlavha qismi va
asosiy qism. Sarlavha qismida Web sahifa haqidagi malumot joylashadi, asosiy
qismda esa Web sahifaning mazmuni bilan tasvirlanish qoidalari joylashadi.
Sarlavha qismi quyidagi ochiluvchi va yopiluvchi teglari orasida
joylashadi. Asosiy qism esa va
Asosiy qism
va
Mening bu sahifamga kiruvchilarga alangali salom
tegi bir qancha qo’shimcha parametrlarga ega. Bu parametrlar
tegning ochiluvchi qismida joylashadi. Parametrlar ikki qismdan iborat bo’ladi:
parametr nomi va parametr qiymati. Masalan bgcolor parametri tasvirlanayotgan
Web sahifa fonining rangini belgilaydi.
Masalan:
Parametrlarning satrli qiymatlari qo’shtirnoq ichida yoziladi. Biz quyida
tegining parametrlari bilan tanishamiz.
Background - fon sifatida biror bir grafik tasvirdan foydalanish. Parametr
qiymati sifatida grafik tasvir joylashgan manzil (URL) beriladi.
Text - tasvirlanayotgan matn rangi.
Link - Web sahifadagi matnli gipermurojat rangi.
Vlink-foydalanuvchi tomonidan oldin murojat qilingan gipermurojaat rangi.
Alink - foydalanuvchi tomonidan tanlangan gipermurojaat rangi.
Lang – Web sahifa matni yozilgan tilni aniqlash.
HTML hujjatining kodida biz hamisha biror bir bezak ob’ektlarining
o’lchamlarini yoki ularning ranglari xususiyatlarini ko’rsatishimizga to’g’ri keladi.
HTML tilida rang va o’lchov birliklarini qo’llashning standart qoidasi
mavjud.
Rang berishning ikkita usuli mavjud. Ko’p qo’llaniladigan usul kerak
rangning RGB kodini ko’rsatishdir. Ma’lumki har qanday rangni uchta asosiy:
qizil, yashil va ko’k ranglarning qorishmasidan hosil qilish mumkin. Brauzerlar
bizga un olti milliondan ortiq rangni tasvirlash imkonyatini beradi, chunki asosiy 3
ta rangdan har birining qiymati 0 dan 255 gacha qiymat qabul qiladi. Ixtiyoriy rang
har biri asosiy ranglarning ulushini ifodalovchi 3 ta son majmuasidan iborat
bo’ladi.
HTML tilida rang qulaylik uchun 16 lik sistemadagi 6 ta raqamlardan tashkil
topadi.
Masalan:
Color = “#FF0000”
16 lik raqamlar oldida “#” belgisi qo’yiladi. Rang ulushlarini ko’rsatib turuvchi
raqamlar tartibiga e’tibor berish kerak. Chunki birinchi qizil, ikkinchi yashil va
uchinchi ko’k rang ulushlari joylashadi. Biz yuqoridagi misolda qizil rangni
tasvirldik.
Rang o’rnatishning muqobil varianti ham mavjud. Quyidagi jadvalda eng
ko’p ishlatiladigan 16 ta rang uchun o’rnatilgan qiymatlar ko’rsatilgan:
Jadval 1.2.
№
Rang
16 lik kodi
Yozma qiymati
1
2
qora
Kumush rang
#000000
#C0C0C0
Black
Silver
3
4
5
6
7
8
9
10
11
12
13
14
15
16
Ok
Tuk qizil
Kizil
Tuk qizil
Och qizil
Yashil
Och yashil
Olxuri rangi
Sarik
Tuk ko’k
Kuk
#808080
#FFFFFF
#800000
#FF0000
#800080
#FF00FF
#008000
#00FF00
#808000
#FFFF00
#000080
#0000FF
#008080
#00FFFF
Gray
White
Marron
Red
Purple
Fuchsin
Green
Lime
Olive
Yellow
Navy
Blue
Teal
Aqua
Bu jadval qiymatlariga asosan qizil rangni quyidagicha tasvirlashimiz ham
mumkin:
Color = “red”
Endi uzunlik o’lchov birliklarini qo’llashni ko’ramiz. Biz Web sahifadagi ob’ekt
o’lchamlarini ikki xil usulda berishimiz mumkin. Birinchi usul o’lchamlar
piksellarda beriladi, ikkinchi usul “o’zak” ob’ektga nisbatan prostentlarda beriladi.
Agar biz Web sahifaga jadval joylashtirib uning enini 50% deb ko’rsatsak u holda
bu 50% brauzer oynasi enining 50% ini tashkil etadi. Jadval yacheykasining
o’lchami esa shu yacheyka joylashgan butun jadval o’lchamiga nisbatan % da
hisobida olinadi. Foydalanuvchi tomonidan brauzer oyna o’lchamlari o’zgartirilsa
o’nga mos ravishda Web sahifa parametrlari ham o’zgaradi. Web sahifa
yaratayotganda brauzer oynasi o’lchami o’zgarganda Web sahifa parametrlari
o’zgarmaydigan usulda yaratish kerak.
Agar biz biror bir ob’ektning enini 30 piksel o’lchamida o’rnatmokchi
bo’lsak, uning yozilishi quyidagicha bo’ladi:
Width = “30”
Agar ob’ekt eni “o’zak” ob’ektning 30% ini tashkil qilishi kerak bo’lsa
yozuv quyidagicha bo’ladi:
Width = “30%”
Parametr qiymatlari qo’shtirnoq ichiga olinishini e’tiborga olish zarur.
Yuqorida ko’rilgan ikki xil usuldan tashqari ob’ekt o’lchamini berishning uchunchi
bir usuli ham mavjud. Bu usulni yuqoridagi ikki usulning o’rtachasi deb hisoblasak
ham bo’ladi. Bunda biz o’lchamlarni bir necha piksel soniga karrali qilib
ko’rsatishimiz mumkin. Masalan bizga 3 ta satrdan iborat jadval berilgan bo’lsin.
Agar har bir satr balandligi 30 pikselga karrali bo’lishini hoxlasak har bir satrni
hosil qiluvchi tegga quyidagi yozuvni yozishimiz lozim:
height=”3*”
Karrali o’lcham berish belgisi sifatida yulduzcha (*) belgisi ishlatiladi. Karrali son
koeffistenti hisoblanganda (*) belgisining chap tomonidagi son 10 ga
ko’paytiriladi. Brauzer bunday ob’ektlarni maksimal o’lchamda tasvirlashga
harakat qiladi. Agar jadval 180 piksel balandlikka ega bo’lsa, u holda har bir satr
balandligi 60 pikselga teng bo’ladi. Agar balandligi 200 piksellik jadval qo’ysak
20 piksellik joy o’z-o’zidan yo’qoladi. Agar satrlarimiz bir xil balandlikda
bo’lishini hoxlasak u holda parametrning quyidagi ko’rinishini qo’llagan ma’qul:
height= “*”
Jimlik bo’yicha yuqoridagi o’lchov berish usuli qo’llaniladi. Agar ob’ektlar
guruqida o’lchamlari ko’rsatilmagan bo’lsa ular berilgan kenglikda maksimal
o’lchamda teng joydashadilar.
|