Farg’ona davlat universiteti san’atshunoslik fakulteti musiqa ta’lim yoʻnalishi


Download 0.85 Mb.
Sana14.06.2020
Hajmi0.85 Mb.
#118731
Bog'liq
LABORATORIYA ISHI 2 0


FARG’ONA DAVLAT UNIVERSITETI SAN’ATSHUNOSLIK FAKULTETI MUSIQA TA’LIM YOʻNALISHI

2-KURS 18.28-GURUH TALABASI KARAYEVA MUSHTARIYNING

TA’LIMDA AXBOROT TEXNOLOGIYALARI FANIDAN TAYYORLAGAN

2-LABORATORIYA ISHI



Tayyorladi Karayeva Mushtariy

Tekshirdi: Shermatova Xilola
LABORATORIYA ISHI № 2
Laboratoriya jihozlari: Kompyuter, brouzer dasturi.
Mavzu: HTML tilida matn, rang, jadval va rasmlar bilan ishlovchi teglar.

Nazariy qism

Internet bilan ishlovchi dasturlar tasvirlarni (grafik elementlar) ochish imkoniga ega bo'lishi bilan internetda mavjud sahifalarning deyarli barchasi tasvirli axborotarni nashir eta boshladi. Siz yaratgan web sahifa qiziqarli va chiroyli dizayn asosiga qurilgan bo'lsa uning o'quvvhilar soni shubhasiz ortadi. Tarvirlar yordamida harakatlanuvchi tugmalar va Gif animatziyalarni kiritish mumkin. Biroq tasvirlar bilan ishlashda ularni hajmi va formatiga e’tibor berish kerak. Hozirgi paytda internetga joylashtirilayotgan deyarli barcha sahifalarda ishlatilayotgan tasvirlar formati *.JPEG yoki *. GIF ni tashkil etadi. Bunga asosiy sabab, bu formatdagi tasvirlar hajmi juda ham oz. Bu formatdagi tasvirlar ishlatilganda Web sahifa hajmi ortib ketmaydi va sizning web sahifangizdan foydalanuvchi sahifani ochilishini uzoq vaqt kutmaydi.


Agar siz boshqa formatdagi tasvirlardan web sahifani bezashda foydalansangiz uning hajmi ortib ketadi va undan foydalanuvcxilarga sahifani ochishda muammolar keltirib chiqaradi. Web safini bezatishda uning dizayiniga *.GIF formatdagi tasvirlardan foydalaning boshqa tasvirlar uchun *.JPEG dan foydalanishingiz mumkin.

image
HTML hujjatning qaysi joyiga tegini joylashtirsangiz, o’sha joyda siz ko'rib turgandek tasvir hosil bo'lad. Yuqorida yozilgan tegiga e’tibor bersangiz, uni yopuvchi tegi yo'qligini sezasiz. Bu tegni yopish shart emas. Faqatgina uni ishlatishda talab qilinadigan shartlardan biri SRC. U siz tasvir sahifada ochilmaydi. Quyida tegi o'lchamlari tasnifini keltiramiz.
SRC
Bu o'lcham ortida tasvir nomi va joylashgan joyga yo'l ko'rsatiladi. Uning yordamida brouser tasvirni qidiradi va ochishga harakat qiladi. Standart holda web sahifada ishlatilgan tasvirlar IMAGE papkasiga joylashtiriladi. Web sihifani o’z kompuyteringizda yaratayotgan paytda tasvirga bo'lgan yo'lni quyidagi tartibda berasiz: C/Web sahifa/Images/photo_01.gif bunda '/' belgisi papkalar nomlarini bir-biridan ajratish uchun ishlatiladi. Agar siz qo'ymoqchi bo'lgan fayl HTML fayllar joylashgan papkada bo'lsa, u holda tasvir joylashgan papkaga yo'lni mana bunday ifodalash mumkin: Images/photo_01.gif. Web sahifa internetga joylashtirilgan taqdirda tasvir joylashgan papkaga yo'l quyidagi tarzda ifodalanadi:
http://www.web sihifa nomi/Images/ photo_01.gif
WIDTH
Tasvir eni o'lchamlarini pikselda belgilaydi. Agar orginal tasvir eni siz qo'ymoqchi bo'lgan joyga kattalik qilsa, siz uni bu teg yordamida uning enini qisqartirishingiz mumkin. Eng yaxshi variant, tasvirni tasvir tahrirlagich dasturi yordamida oldindan kerakli hajimlarini belgilab olishdir. Siz tasvirlarni web sahifaga joylashtirayotgan paytda har doim tasvir tahrirlagich dasturnii aktivlash- tirib qo'ying va o’lchamlar to'g'ri kelmagan taqdirda uni tasvir bilan ishlovchi dastur yordamida qayta ishlang.
HEIGHT
Tasvir bo'yi o'lchamlarini kiritish uchun hizmat qiladi. Agar siz tasvirning real o'lchamlarini o'zgartirmoqchi bo'lsangiz unda: tasvir eni uchun WIDTH va tasvir bo'yi uchun HEIGHT teglaridan foydalanishingiz mumkin. Tasvir o'lchami 1 dan boshlab cheksiz sanoq sonlarni kiritishingiz mumkin.
BORDER
Sahifaga kiritilgan tasvir atrofida chiziqli ramka hosil qiladi. Ramka qalinligin piksellar yordamida o'zgartiriladi. Ramka qalinligini sonlar bilan 1 dan cheksiz. Sahifada tasvir kiritigan maydondagi matn qaysi rangda bo'lsa, tasvir ramkasi ham o'sha rangda bo'ladi.
ALT
Agar brouser yoki sahifani ochuvchi dastur tasvirlarni ochish imkoniga ega bo'lmagan taqdirda ushbu o'lchamdan so'ng kiritilgan matn aynan shu joyda tasvir borligidan habar beradi. Brauser tasvirlarni ko'rsatish imkoniga ega bo'lsa, tasvir ustiga kursor olib kelinganda ALT o'lchamidan so'ng qanday so'z kiritilgan bo'lsa shu so'z yoki jumla kursor ostida hozil bo'ladi. Bu o'lcham ostida tasvir bilan bo'g'liq bo'lgan turli qo'shimcha ma'lumotlar kiritish mumkin. Agar brauser tasvirni umuman ko'rsatmagan taqdirda, tasvir hosil bo'lishi lozim bo'lgan maydonda ALT o'lchamidan so'ng kiritilgan ma'lumot ekranda hosil bo'ladi.
ALIGN
Bu o'lcham grafik elemet sahifadagi boshqa elementlarga nisbatan joylashtirish o'rnini tekislash uchun ishlatiladi. Yuqorida keltirilgan tasvir jadval va matnga nisbatan ALIGN teng left. Bu tasvirni sahifaning chap burchagida jadval va matnga nisbatan joylashtirilsin komandasini anglatadi. ALIGN o'lchamining ishlatilishi mumkin bo'lgan qo'shimcha komandalari:
IMG tegini qo'llash qoidalari
tegi bilan bo'g'liq bo’lgan, quyida keltirilgan asosiy qoidalar bilan tanishib chiqing va o’z sahifangizni yaratishda ushbu qoidalarga doim rioya qilishga harakat qiling.
• Tasvir nomi va joylashgan o’rnini yozganda harflarning bir xilda bo’lishini taminlash katta ahamiyatga ega.
Tasvir joylashgan joy nomi va tasvirning nomini kiritganda harflarni bir xilda yozilishi shart. Biror bir harfni tushrib qoldirish yoki xato yozilishi tasvirni ochishda xatoliklarni keltirib chiqaradi.
• Tasvir yoki papka nomini kiritganda probel ishlatmang.
Web safifani yaratayotganingizda fayllar yoki papkalar nomini kiritganda probel (bo'shliq) ishlatmang. Agar siz kiritgan nom ikki yoki bir necha so'zlardan iborat bo'lsa, probel ornida _ (pastdan chiziqsha) ishlatishingiz mumkin. Masalan: .../Chet_elga_sayohat/Germaniya/Baden_baden_01.jpeg

• Internetda ishlatiluvchi tasvir formatlari.


Hozirgi paytda Internetda ikki xil formatdagi tasvirlar keng qollanilib kelinmoqda. Bu formatlar: GIF (bu formatdagi tasvirlar *.gif qisqartmasiga ega) hamda JPEG (bu formatdagi tasvirlar esa *. jpg yoki * .jpeg qisqartmasiga ega). Siz ham ushbu formatdagi tasvirlardan foydalaning. Boshqa formatdagi tasvirlarni aksariyat brauserlar ocha olmaydi.
• Har doim WIDTH va HEIGHT o'lchamlarini kiritishga harakat qiling.
Bu sizning web sahifangizni ochilishini tezlashtiradi va tasvirlarni asl o’lchamda bo'lishini ta'minlaydi.
• Tasvir hajmini suniy kichraytirish.
WIDTH va HEIGHT orqali tasvirning real o'lchamini kichraytirish mumkin. Ammo bu usuldan iloji boricha kamroq foydalangan maqul. Eng yaxshi usul tasvirni real o'lchamini tasvir tahrirlagich dastur yordamida kichraytirish. Bu usul tasvirning ochilish vaqtini kamaytiradi.
• Tasvir hajmini suniy kattalashtirish.
Tasvir o’lchami kattalashtirilganda yoki kichraytirilganda uning sifatida o'zgarish sodir bo'ladi. Agar siz o’lchamlarni o'zgartirganda bir xillikka e’tibor bermasangiz, tasvir sifatini buzilishiga olib keladi. WIDTH va HEIGHT o’lchamlari orqali tasvir hajmini kattalashtirganda, real o'lchamni 2 matra, 3 marta va shu tariqa oshishiga erishish kerak. Masalan tasvirning real o’lchami WIDTH = 100, HEIGTH 200 ga teng bo'lsa, uni ikki marta kattalashtirganda WIDTH=200, HEIGTH= 400 ga teng bo'lishi shart. Bu usul tasvir sifatidagi salbiy o'zgarishlarni bir oz yumshatadi. Shuningdek, ayni holatni tasvir o'lchamini kichraytirishda ham qo'llash maqsadga muvoffiq.
• Har doim ALT o'lchamini qo'llang.
Har doim ALT dan so'ng tasvirga aloqador qo'shimcha axborotni kiritishga harakat qiling. Bunnig asosiy sababi, siz joylashtirgan tasvir ochilmangan taqdirda, Internetdan foydalanuvchi siz kiritgan tasvir izohini o'qiydi va minimum axborotga ega bo'ladi.

Amaliy qism

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: qizilyashil 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 va ularning oldiga “reshotka” “#” belgisi quyiladi.
Masalan:
Color = “#FF0000” Qizil rang ekanligini bildiradi
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 tasvirladik.
Rang o’rnatishning muqobil varianti ham mavjud. Quyidagi jadvalda eng ko’p ishlatiladigan 16 ta rang uchun o’rnatilgan qiymatlar ko’rsatilgan:

1-jadval

Black


#000000

Qora

Maroon

#800000

Bordoviy

Silver

#C0C0C0

Kumushrang

Red

#FF0000

Qizil

Grey

#808080

Kulrang

Purple

#800080

Purpurnaya

White

#FFFFFF

Oq

Green

#008000

Yashil

Fuchsia

#FF00FF

Pushti

Navy

#000080

To’q ko’k

Lime

#00FF00

Laym

Blue

#0000FF

Ko’k

Olive

#808000

Olivka ranq

Teal

#008080




Yellow

#FFFF00

Sariq

Aqua

#00FFFF

Aqva

Uzunlik o’lchov birliklari
Endi uzunlik o’lchov birliklarini qo’llashni ko’ramiz. Biz Web sahifadagi ob'ek o’lchamlarini ikki xil usulda berishimiz mumkin. Birinchi usul o’lchamlar piksellarda beriladi, ikkinchi usul “o’zak” ob'ektga nisbatan protsentlarda 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’rnatmoqchi 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 xohlasak har bir satrni hosil qiluvchi tegga quyidagi yozuvni yozishimiz lozim:
Height=“3*”
Karrali o’lcham berish belgisi sifatida yulduzcha (*) belgisi ishlatiladi. Karrali son koeffitsenti 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 joylashadilar.

Matnlarni bezash
HTML tilida matnni tasvirlashning bir qancha usullari mavjud. Brauzer ekranida matn satrini tasvirlash uchun hech qanday teg ishlatishga hojat yo’q. Matnni yozish kifoya. Lekin uni hattoki abzatsga bo’lish ham teglarsiz amalga oshmaydi. Har xil kompyuter tizimlarida matnlarni abzatsga bo’lish uchun har xil simvollar ishlatiladi, lekin HTML hujjati kompyuter tizimi qanday bo’lishidan qa'tiy nazar bir xil tasvirlanishi lozim va shuning uchun abzatsni ifodalovchi teg kiritilishiga to’g’ri kelgan. Har bir abzats boshida 
 tegi qo’yiladi, oxirida esa yopiluvchi 
 tegi qo’yiladi. Bu teg o’z parametrlariga ega. Bu parametrlar qatoriga identifikatsiya parametrlari class va id, shaklli bezash parametri style va tekislash (tenglash) parmetri align kiradi.
Abzatsni brauzer oynasining o’ng yoki chap tomoniga tekislash, markazlashtirish yoki to’la eniga yoyib yozish uchun ularga mos ravishda leftrightcenter va justify qiymatlari ishlatiladi. Bularning qo’llanilishini quyidagi misolda ko’ramiz:

Misol 1.


Abzatslarni gorizontal tanlash

chap tomonga tekislagan abzats


o’ng tomonga tekislangan abzats


markazlashtirilgan abzats


eni bo’yicha yoyib yozilgan abzats

Haqiqatni yomon ko`radigan odamlar uni dadil aytadiganlarni ham yomon ko`radilar. Felenon

“Keyingi satrga bo’lingan abzats”


Mutolaa insonni bilimdon qiladi, suhbat zukko bo‘lishga, yozib olish odati esa aniq bo‘lishga yordam beradi. Frensis Bekon

Navbatdagi abzats


“Bir bo’sh satrdan keyin yozilgan abzats”
Qanday bo‘lsalar o‘shanday qolishga ahd qilganlargina nodon. Aflotun

ettinchi o’lchov


oltinchi o’lchov


beshinchi o’lchov


to’rtinchi o’lchov


uchinchi o’lchov


ikkinchi o’lchov


birinchi o’lchov



matnlar  qalin yoki kursiv  ko’rinishda bo’lishi mumkin 

Bir vaqtning o’zida  ham qalin ham kursiv ko’rinishda bo’lishi ham mumkin 


tagi chizilgan  va usti chizilgan
ko’rinishda ham bo’ladi


 yoki kengaytirilgan 

 bo’lishi mumkin 




Biz simvol o’lchovini kattalashtirishimiz
va kichraytirishimiz mumkin

 Bu oddiy matn 


 Bu  ajratilgan va  juda sezilarli ajratilgan  matn 


 Bu  sitata, bu esa  aniqlangan termin


 Biz  dastur kodini  foydalanuvchi tomonidan kiritilgan


 kbd matnini, yana  dasturning matnli natijasini  va  o’zgaruvchilarni  yozishimiz mumkin


 Abbreviaturalar  va  akronimlar ana shunday tasvirlanadilar

Kvadrat tenglamaning umumiy ko’rinishi ax2+bx+c=0




Suvning ximiyaviy formulasi quyidagicha: H2O

Download 0.85 Mb.

Do'stlaringiz bilan baham:




Ma'lumotlar bazasi mualliflik huquqi bilan himoyalangan ©fayllar.org 2024
ma'muriyatiga murojaat qiling