Veb -sahifaga joylashtirilgan grafik tasvirlar nafaqat ma'lumotni yaxshiroq idrok etishga yordam beradi, balki sahifalarni yorqinroq va esda qolarli qiladi. Siz grafik tasvirlarni o'zingiz tayyorlashingiz yoki dizaynerlarning xizmatlaridan foydalanishingiz mumkin. Bundan tashqari, Microsoft Office, CorelDraw va boshqalar kabi dasturiy mahsulotlarning grafik fayllar kutubxonalaridan foydalanishingiz mumkin.
Keling, Microsoft Office -da joylashgan Clip Art kutubxonasidan grafik tasvirni yaratadigan veb -saytning bosh sahifasiga joylashtiraylik. Buning uchun quyidagi bosqichlarni bajaring:
- Yangi yaratilgan veb -saytni oching.
- Bosh sahifani ochish uchun paneldagi index.htm fayl nomini ikki marta bosing Papkalar ro'yxati(Papkalar ro'yxati).
- Menyuda Kiritmoq(Qo'shish) buyrug'ini tanlang Chizma Rasmlar(Klip -art). FrontPage oynasida panel paydo bo'ladi. Rasm kiritish(Klip art qo'shish).
- Ushbu panelda buyruqni tanlang Rasmlar to'plami(Media galereyasi). Grafik tasvirni tanlash imkonini beruvchi dialog oynasi ochiladi (15.8 -rasm).
Guruch. 15.8.
Muloqot oynasining yuqori qismida, oynada ko'rsatilgan ob'ektlarning ko'rsatilishini boshqaruvchi tugmachalardan tashqari, ob'ektlarni nusxalash va o'chirish bilan bir qatorda, tayinlash tugmalari mavjud (jadvalga qarang).
- Panel To'plamlar ro'yxati multimediya fayllari bo'lgan kompyuter papkalarini, shuningdek, rasmlar kutubxonasining klip rasmlarini o'z ichiga oladi. Sizni qiziqtirgan rasmlar toifasidagi papkani oching. Ushbu toifadagi tasvirlar oynaning ishchi maydonida paydo bo'ladi. Kursorni tasvirga qo'yganda, tasvirning nomi, hajmi va undagi fayl, shuningdek grafik tasvirining formatini ko'rsatuvchi ko'rsatma ko'rinadi (15.9 -rasm).
- Tanlangan rasmning o'ng tomonidagi o'q tugmasini bosing. Kontekst menyusi paydo bo'ladi.
- Kontekst menyusidan buyruqni tanlang Nusxalash(So'riga.)
- Veb -sahifaga o'ting va har qanday qulay asbob yordamida clipboarddan rasmni joylashtiring. Masalan, tugmalar birikmasini bosing
+. - Tugmani bosish orqali veb -sahifani grafik tasvir bilan saqlang Saqlash Standart asboblar panelida (Saqlash). Muloqot oynasi paydo bo'ladi O'rnatilgan fayllar saqlanmoqda(O'rnatilgan fayllarni saqlash) (15.10 -rasm), sahifada joylashtirilgan tasvirni papkada saqlashni taklif qiladi tasvirlar Fayl kutubxonada joylashgan nomdagi veb -sayt. Bu oynada quyidagi maqsadlar uchun tugmalar mavjud:
- Qayta nomlash(Nomini o'zgartirish) - fayl nomini o'zgartirishga imkon beradi.
- Jildni o'zgartirish(Jildni o'zgartirish) - muloqot oynasini ochadi Jildni o'zgartirish Faylni saqlash uchun boshqa papkani tanlash imkonini beruvchi joriy veb -sayt papkalarini o'z ichiga olgan (Jildni o'zgartirish).
- Harakat(Harakatni o'rnatish) dialog oynasini ochadi Harakatni belgilash, qiymatini o'zgartirish imkonini beradi Saqlash Harakatlar ustunini (Saqlash) Saqlamang(Saqlamang). Qiymat tanlashda Saqlash rasm siz ko'rsatgan veb -sayt papkasida saqlanadi, aks holda Clip Art kutubxonasidagi rasmga havola Web -sahifada qoladi.
Hudud Chizma[Rasmni oldindan ko'rish] joylashtirilgan tasvirni ko'rsatadi. Muloqot oynasida sozlash orqali O'rnatilgan fayllar saqlanmoqda kerakli parametrlarni bosing OK. Grafik fayl siz ko'rsatgan veb -sayt papkasida saqlanadi.
Guruch. 15.10.
Fayldan grafik tasvirni joylashtirish
Biz veb -sahifada Clip Ait kutubxonasidan grafik tasvirni joylashtirishni ko'rib chiqdik. Fayldagi grafik tasvirni sahifaga joylashtirish uchun quyidagilardan birini bajaring:
- Menyuda Kiritmoq(Qo'shish) buyrug'ini tanlang Chizma(Rasm), keyin ochilgan pastki menyuda - variant Fayldan(Fayldan)
- Tugmani bosing Fayldan rasm qo'shing(Fayldan rasm qo'shish) standart asboblar panelida
- Tugmani bosing Fayldan rasm qo'shing(Fayldan rasm qo'shish) asboblar panelida Chizmalar(Rasmlar)
Agar siz ushbu harakatlardan birini qilsangiz, dialog oynasi ochiladi. Chizma(Rasm) (15.11 -rasm). Bu oynadan kerakli grafik faylni toping va tugmani bosib uni Web -sahifaga joylashtiring. Kiritmoq(Kiritmoq). Muloqot oynasi yopiladi va rasm sahifaga joylashtiriladi.
Guruch. 15.11.
Rasm xususiyatlarini sozlash
Rasmni veb -sahifaga joylashtirgandan so'ng, dialog oynasi yordamida uning xususiyatlarini sozlash kerak Rasm xususiyatlari(Rasm xususiyatlari) (15.12 -rasm). Uni ochish uchun rasmni bosing va keyin quyidagilardan birini bajaring:
- Menyuda Format(Format) buyrug'ini tanlang Xususiyatlari(Xususiyatlar)
- Kontekst menyusi buyrug'ini tanlang Rasm xususiyatlari(Rasm xususiyatlari)
- Klaviatura kombinatsiyasini bosing
+
Muloqot oynasi Rasm xususiyatlari uchta yorliqni o'z ichiga oladi: Umumiy(Umumiy), Video yozib olish(Video), Ko'rinish(Tashqi ko'rinishi). Keling, ushbu dialog oynasi yordamida sozlash imkoniyatlarini batafsil ko'rib chiqaylik.
Rasm qo'shish ikki bosqichda amalga oshiriladi: birinchi navbatda, kerakli format va o'lchamdagi grafik fayl tayyorlanadi, so'ngra fayl sahifada element yordamida ko'rsatiladi. Veb -grafik uchun ikkita format keng qo'llaniladi - PNG va JPEG. Ularning ko'p funktsiyali, ko'p qirraliligi, sayt uchun etarli sifatga ega bo'lgan oz miqdordagi manba fayllari ularga ijobiy xizmat qildi, aslida ularni veb -tasvirlar uchun standart sifatida belgilab berdi. Ularga qo'shimcha ravishda, saytlar GIF va SVG formatlarini ishlatadi. PNG-8 (Portativ tarmoq grafikasi)-bu uzoq vaqtdan beri xususiy algoritmlardan foydalangan GIFni almashtirish uchun yaratilgan bepul format.
.
Fayl formatlari
PNG-8 formati
Xususiyatlar
- U tasvirda 8-bitli palitradan (256 rang) foydalanadi, buning uchun u o'z nomidan sakkiz raqamni oldi. Bunday holda, siz faylda qancha rang saqlanishini tanlashingiz mumkin - 2 dan 256 gacha.
- GIFdan farqli o'laroq, u animatsiyani ko'rsatmaydi.
Qo'llash sohasi
PNG-24 formati
PNG-24-bu PNG-8 ga o'xshash format, lekin JPEG kabi 24-bitli rangli gamut yordamida fotosuratlardagi ranglarning yorqinligi va tiniqligini saqlaydi. GIF va PNG-8 kabi, chizilgan chizmalar, logotiplar yoki rasmlar kabi tasvir tafsilotlarini saqlaydi.
Xususiyatlar
- Har bir fayl uchun taxminan 16,7 million rang ishlatiladi, shuning uchun bu format to'liq rangli tasvirlar uchun ishlatiladi.
- Ko'p darajali shaffoflikni qo'llab-quvvatlaydi, bu tasvirning shaffofdan rangli joylariga silliq o'tishni yaratishga imkon beradi.
- Ishlatilgan siqishni algoritmi tasvirdagi barcha ranglar va piksellarni o'zgarishsiz saqlaganligi sababli, boshqa formatlarga nisbatan PNG-24 grafik faylining eng katta yakuniy o'lchamiga ega.
Qo'llash sohasi
Fotosuratlar, shaffof va yarim shaffof joylarni o'z ichiga olgan chizmalar, ko'p rangli va tasvirning o'tkir qirralari bo'lgan chizmalar.
JPEG formati
JPEG (Joint Photographic Expert Group) - veb -sayt yaratish va fotosuratlarni saqlashda keng qo'llaniladigan mashhur rasmli fayl formati. JPEG 24-bitli ranglarni qo'llab-quvvatlaydi va fotosuratlaringizning yorqinligi va ranglarini o'zgartirmaydi. JPEG algoritmi ma'lumotlarni tanlab rad etishi sababli bu format yo'qotilgan siqilish deb ataladi. Siqish tasvirni buzishi mumkin, ayniqsa unda matn, nozik detallar yoki o'tkir qirralar bo'lsa. JPEG formati shaffoflikni qo'llab -quvvatlamaydi. Rasmni ushbu formatda saqlaganingizda, shaffof piksellar belgilangan rang bilan to'ldiriladi.
Xususiyatlar
- Rasmdagi ranglar soni taxminan 16,7 millionni tashkil etadi, bu tasvirning fotosurat sifatini saqlab qolish uchun etarli.
- Formatning asosiy xarakteristikasi - "sifat", bu sizga yakuniy fayl hajmini boshqarishga imkon beradi. Sifat 0 dan 100 gacha o'lchanadi, qiymat qanchalik baland bo'lsa, rasm shunchalik yaxshi bo'ladi, lekin fayl hajmi ham oshadi.
- Progressiv JPEG texnologiyasini qo'llab-quvvatlaydi, unda tasvir to'liq yuklanmaguncha tomoshabinda tasvirning past aniqlikdagi versiyasi paydo bo'ladi.
Qo'llash sohasi
Asosan fotosuratlar uchun ishlatiladi. Shaffof joylar, kichik detallar yoki matnni o'z ichiga olgan rasmlar uchun juda mos emas.
GIF formati
GIF (Graphics Interchange Format) - animatsion tasvirlarni yaratishda keng qo'llaniladigan grafik fayl formati. GIF 8-bitli rangdan foydalanadi va tasvir tafsilotlarini saqlagan holda tekis rangli maydonlarni samarali siqadi.
Xususiyatlar
- Rasmdagi ranglar soni 2 dan 256 gacha bo'lishi mumkin, lekin u 24 bitli palitradan har qanday rang bo'lishi mumkin. GIF fayli shaffof joylarni o'z ichiga olishi mumkin. Agar oq rangdan boshqa fon ishlatilsa, u rasmdagi "teshiklar" orqali ko'rsatiladi.
- Rasmlarni kadrlar almashinuvini qo'llab-quvvatlaydi, bu formatni oddiy animatsiyalar yaratish uchun mashhur qiladi.
- Yo'qotishsiz siqish usulini qo'llaydi
Qo'llash sohasi
Matn, logotiplar, o'tkir qirrali illyustratsiyalar, jonlantirilgan chizmalar, shaffof joyli tasvirlar, bannerlar.
SVG formati
SVG (Scalable Vector Graphics) - bu tasvir piksellardan emas, balki ob'ektlar va egri chiziqlardan iborat bo'lgan vektorli format. Shu sababli, u nuqtalardan iborat rastrli fotosuratlar uchun mos emas, lekin aniq konturli tasvirlar uchun juda mos keladi.
Xususiyatlar
- SVG formatidagi tasvirlar tasvir sifatini yo'qotmasdan xohlagan darajada kattalashtirilishi mumkin.
- Fayl hajmi odatda kichik.
- Animatsiya va interaktivlikni qo'llab -quvvatlaydi.
Qo'llash sohasi
Matn, logotiplar, o'tkir qirrali rasmlar.
Rasm qo'shish
Veb -sahifaga rasm qo'shish uchun elementdan foydalaning , src atributi grafik faylning manzilini belgilaydi. Rasm qo'shishning umumiy sintaksisi quyidagicha.
Ham src, ham alt atributlari talab qilinadi.
Src atributi grafik faylga yo'lni belgilaydi, uni ko'rsatish uchun siz mutlaq yoki nisbiy manzilni ishlatishingiz mumkin. Keling, veb -sahifaga joylashtirish uchun rasmga yo'lni aniqlashning bir necha xil usullarini ko'rib chiqaylik. Misol tariqasida, sayt ildizining rasmlar papkasida saqlanadigan target.png nomli faylni olaylik.
http://example.ru/images/target.png
Agar manzil protokoldan boshlangan bo'lsa (http: // yoki https: //), unda biz mutlaq manzil haqida gapiramiz. Veb -sahifa mahalliy kompyuterda saqlangan bo'lsa ham, tasvir har doim ko'rsatilgan Internet manzilidan yuklab olinadi.
//example.ru/images/target.png
Bu protokolni ko'rsatmasdan tasvirning mutlaq manzili. Brauzer avtomatik ravishda sayt ishlayotgan kerakli protokolni almashtiradi (http: // yoki https: //). E'tibor bering, bunday manzil mahalliy veb -sahifalarda ishlamaydi, faqat veb -server nazorati ostida.
/tasvirlar/target.png
Agar URL boshida oldinga chiziq (/) bo'lsa, bu rasmlar papkasi saytning ildizida joylashganligini bildiradi. Bir papkani boshqasiga joylashtirish mumkin, shuning uchun yo'l uzayishi mumkin. Masalan, /assets/images/target.png, aktivlar papkasi saytning ildizida joylashganligini, u erda target.png fayli joylashgan tasvirlar papkasini o'z ichiga oladi.
../images/target.png
Manzil boshida (../) qiyshiq chizilgan ikkita nuqta tasvirli papka papkaning tuzilishida HTML hujjatiga nisbatan bir daraja yuqori ekanligini ko'rsatadi. Fig. 1, target.png rasmini qo'shmoqchi bo'lgan source.html faylini ko'rsatadi.
Guruch. 1. Fayllarni joylashtirish
rasmlar / target.png
Manzil boshida nuqta bo'lmagan papka nomi HTML hujjati va rasm papkasi bir xil darajada ekanligini ko'rsatadi (2 -rasm).
Guruch. 2. Fayllarni joylashtirish
target.png
Bitta fayl nomi tasvir va veb -sahifa bir joyda joylashganligini ko'rsatadi (3 -rasm).
Guruch. 3. Fayllarni joylashtirish
1 -misol veb -sahifaga grafik qo'shishning bir necha usullarini ko'rsatadi.
Misol 1. Rasmlarni qo'shish
Muqobil matn
Muqobil matn tasvirlarning muhim qismidir va ko'rish qobiliyatiga ega bo'lmaganlar uchun mo'ljallangan bo'lib, ular tasvirlarni ko'ra olmaydi va eshitish orqali saytdan ma'lumot ololmaydi. Maxsus ekran o'quvchilari saytdagi matnni o'qiydilar va tasvirlar o'rniga alt atributida yozilgan matnni aytadilar. Odatiy brauzerlarda, agar biror sababga ko'ra rasmlar veb -sahifada ko'rsatilmasa, alt -kontent ko'rsatiladi.
Alt atributi tasvirning mazmunini tasvirlab berishi kerak va agar tasvir dekorativ funktsiyani bajarsa va hech qanday mazmunli ma'noga ega bo'lmasa, altni bo'sh qoldiring (2 -misol).
Misol 2. Alt dan foydalanish
Agar rasmlar ko'rinadigan asboblar panelini talab qilsa, unda siz global sarlavha atributidan foydalanishingiz kerak, uni faqat rasmlarga emas, balki istalgan elementga qo'shish mumkin. Rasm ustida turganingizda, sarlavha atributining qiymatini o'z ichiga olgan matn paydo bo'ladi (3 -misol).
Misol 3. Sarlavhadan foydalanish
Ko'rsatmalarning ko'rinishi maxsus brauzerga bog'liq va uni o'zgartirib bo'lmaydi. Fig. 2 Firefox brauzerida asboblar panelini ko'rsatadi.
Guruch. 2. Maslahatchi turi
Rasm o'lchamini o'zgartirish
Elementning rasmini o'zgartirish uchun kenglik (kenglik) va balandlik (balandlik) atributlari berilgan. Qiymat sifatida piksellar yoki foizlar ishlatiladi. 4 -misolda bu atributlarning qo'shilishi ko'rsatilgan
.
Misol 4. Rasmning o'lchamlari
Kenglik va balandlik atributlari ixtiyoriy, rasm yuklangandan so'ng, brauzer avtomatik ravishda asl hajmini o'rnatadi. Bu atributlar asosan quyidagi maqsadlarda ishlatiladi:
- rasm uchun joy ajratish;
- katta fotosuratlar hajmini kamaytirish;
- Retina displeylari uchun tasvir sifatini yaxshilash.
Agar tasvirning o'lchamlari aniq ko'rsatilgan bo'lsa, hujjatni yuklash paytida brauzer tasvirga mos keladigan bo'sh joyni ko'rsatish uchun ulardan foydalanadi. Aks holda, brauzer rasm to'liq yuklanishini kutadi, so'ngra tasvirning kengligi va balandligini o'zgartiradi. Bunday holda, matnni qayta formatlash mumkin, chunki dastlab rasmning o'lchami noma'lum va u avtomatik ravishda kichik qilib o'rnatiladi.
Rasmning kengligi va balandligi yuqoriga ham, pastga ham o'zgarishi mumkin. Brauzer qo'shimcha piksellarni o'zi o'chirib tashlaydi yoki aksincha, mos o'lchamdagi tasvirni olish uchun etishmayotganlarni to'ldiradi. Olingan rasmning sifati uning mazmuniga bog'liq; har holda, esda tutish kerakki, faqat filmda tasvirni yo'qotmasdan tasvirni cheksiz kattalashtirish mumkin.
Retina displeylar yuqori piksellar soniga va tasvir tafsilotlariga ega, shuning uchun oddiy tasvirlar biroz yuvilgan ko'rinadi. Ularning sifatini yaxshilash uchun rasmlar ikki barobar hajmda tayyorlanadi. Masalan, agar veb -sahifaga 400 pikselli kenglikdagi rasm kerak bo'lsa, biz 800 pikselli kenglikdagi fotosuratni olamiz, lekin kengligini 400 piksel kengligida qoldiramiz.
Kenglik va balandlik atributlari birgalikda ketishi shart emas. Agar ushbu atributlardan birortasi ko'rsatilmagan bo'lsa, brauzer avtomatik ravishda tasvirning eng katta nisbati asosida kerakli qiymatni almashtiradi.
Biz rasmning kengligi va balandligini mustaqil ravishda almashtirganimiz sababli, rasmni vertikal yoki gorizontal ravishda cho'zish orqali ataylab uning nisbatlarini buzishimiz mumkin.
Pikseldan tashqari, o'lchov sifatida foizli belgidan foydalanishga ruxsat beriladi. Bunday holda, kenglik asosiy elementga nisbatan.
Bunday hollarda balandlik bilan bog'liq qiyinchiliklar bo'ladi, chunki tasvir balandligi foiz sifatida hisoblanadi, agar uning balandligi aniq aniqlangan bo'lsa. Agar bosh element balandligi hech qanday tarzda ko'rsatilmagan bo'lsa, balandlik = "100%" kabi yozuv e'tiborga olinmaydi.
Salom, aziz blog o'quvchilari! Ushbu maqolada siz hamma narsani bilib olasiz rasmni html sahifasiga qanday kiritish mumkin... O'z sahifangizga joylashtirmoqchi bo'lgan yoki veb -saytingizga logotip qo'yishni xohlaydigan bir nechta rasmlar bormi? Bularning barchasi oson. Ushbu maqolani o'qib bo'lgach, siz rasmlaringizni html sahifalariga hech qanday qiyinchiliksiz kiritishingiz mumkin bo'ladi. Buning uchun biz bu haqda batafsil gaplashamiz img yorlig'i va uning atributlari, gif, jpeg va png kabi grafik fayl formatlarini tezda ko'rib chiqing va saytingizga video va audio qo'shishni osonlashtiradigan yangi HTML5 xususiyatlarini ko'ring.
Grafik ma'lumotlar va html matnlarini bitta faylga birlashtirish mumkin emasligi sababli, ularni html sahifalarining boshqa elementlariga qaraganda saytda ko'rsatishning boshqa usuli qo'llaniladi. Birinchidan, grafik tasvirlar va boshqa multimediali ma'lumotlar alohida fayllarda saqlanadi. Va ularni veb -sahifaga joylashtirish uchun ushbu alohida fayllarga havolalarni o'z ichiga olgan maxsus teglar ishlatiladi. Ayniqsa, bunday belgi img yorlig'i... Manzil bilan bunday tegni uchratgan brauzer avval veb -serverdan rasm, audio yoki video yozilgan tegishli faylni so'raydi va shundan keyingina uni veb -sahifada ko'rsatadi.
Barcha grafik tasvirlar va umuman veb -sahifadan alohida fayllarda saqlanadigan har qanday ma'lumotlar deyiladi amalga oshirildi sahifa elementlari.
Rasm qo'shishdan va "img" yorlig'ini batafsil ko'rib chiqishdan oldin, grafik formatlari haqida bir oz ma'lumotga ega bo'lishga arziydi.
Grafik tasvir formatlari.
Turli xil grafik formatlar mavjud, lekin brauzerlar faqat bir nechtasini qo'llab -quvvatlaydi. Keling, ulardan uchtasini ko'rib chiqaylik.
1. JPEG formati(Fotosuratlar bo'yicha ekspertlar guruhi). Rasmlarni saqlash uchun ishlatiladigan juda mashhur format. 24-bitli rangni qo'llab-quvvatlaydi va fotosuratlardagi barcha yarim tonlarni o'zgarishsiz saqlaydi. Ammo jpeg shaffoflikni qo'llab -quvvatlamaydi va tasvirlardagi kichik detallar va matnni buzadi. JPEG asosan fotosuratlarni saqlash uchun ishlatiladi. Ushbu formatdagi fayllar jpg, jpe, jpeg kengaytmalariga ega.
2. GIF formati(Grafik almashish formati). Ushbu formatning asosiy afzalligi - bir vaqtning o'zida bir nechta tasvirni bitta faylda saqlash imkoniyati. Bu butun animatsion videolarni yaratishga imkon beradi. Ikkinchidan, bu oshkoralikni qo'llab -quvvatlaydi. Asosiy kamchilik - bu faqat 256 ta rangni qo'llab -quvvatlash, bu rasmlarni saqlash uchun yaxshi emas. GIF asosan logotiplar, bannerlar, shaffof joyli va matnli tasvirlarni saqlash uchun ishlatiladi. Ushbu formatdagi fayllar gif kengaytmasiga ega.
3. PNG formati(Portativ tarmoq grafikasi). Ushbu format eski GIF va ma'lum darajada JPEG o'rnini bosuvchi sifatida ishlab chiqilgan. Shaffoflikni qo'llab -quvvatlaydi, lekin animatsiyaga ruxsat bermaydi. Ushbu format png kengaytmasiga ega.
Saytlar yaratishda ular odatda JPEG yoki GIF formatidagi rasmlardan foydalanadilar, lekin ba'zida PNG -dan foydalanadilar. Asosiysi, qaysi hollarda qaysi formatdan foydalanish yaxshiroq ekanligini aniqlash. Qisqasi:
- GIF asosan animatsiya uchun ishlatiladi;
- PNG - bu hamma narsaning formati (ikonkalar, tugmalar va boshqalar).
JPEG eng yaxshisi matnni o'z ichiga olmaydigan fotosuratlar yoki kulrang o'lchamdagi tasvirlarni saqlash uchun ishlatiladi;
Html sahifalariga rasmlarni kiritish
Xo'sh, qanday qilib rasmni veb -sahifaga joylashtirish mumkin? Rasm qo'shish bitta rasmga ruxsat beradi img yorlig'i... Brauzer tasvirni img tegiga duch keladigan joyga joylashtiradi.
Html -ga rasm qo'shing sahifa shunday ko'rinadi:
Bu html kodi veb -sahifaga rasm joylashadi, u image.jpg faylida saqlanadi, u veb -sahifa bilan bir papkada joylashgan. Ko'rib turganingizdek, rasmning manzili ko'rsatilgan src xususiyati... Sizga allaqachon aytganlarimni. Shunday qilib, src atributi tasvir bilan faylning manzilini ko'rsatishga xizmat qiladigan majburiy atributdir. Src atributisiz img tegining ma'nosi yo'q.
Men rasmli fayl manzilini ko'rsatishga yana bir qancha misollar keltiraman:
bu html kodi sahifaga image.jpg deb nomlangan rasmni kiritadi, u veb -sayt ildizida joylashgan rasmlar papkasida saqlanadi.
Src atributi sizga nisbiy tasvir havolalaridan ko'proq narsani belgilash imkonini beradi. Tasvirlar html sahifalari bilan bir qatorda Internetda saqlanganligi sababli, har bir rasm faylining o'z url -si bor. Shuning uchun tasvirning urlini src atributiga kiritish mumkin. Masalan:
Ushbu kod sahifaga mysite.ru saytidan rasm qo'shadi. Adpec URL odatda boshqa saytdagi rasmga ishora qilganda ishlatiladi. Saytingizda saqlanadigan rasmlar uchun nisbiy havolalardan foydalanish yaxshidir.
Img yorlig'i inline elementdir, shuning uchun uni blok elementi ichiga joylashtirish yaxshidir, masalan, "P" yorlig'i ichida - paragraf:
Keling, html -dagi oldingi maqolalardan rasmni o'z sahifamizga kiritamiz. Men o'z sahifamning html fayli yonida "rasmlar" papkasini yarataman va u erda "bmw.jpg" rasmli faylni qo'yaman, u shunday ko'rinadi:
Keyin rasm qo'shilgan sahifaning html-kodi shunday bo'ladi:
Va biz brauzerda ko'rsatish natijasini ko'rib chiqamiz:
Ko'rib turganimizdek, rasmlarni veb -sahifalarga joylashtirishda hech qanday qiyin narsa yo'q. Keling, "img" tegining yana bir qancha muhim atributlarini ko'rib chiqaylik.
Alt atributi - bu orqaga qaytish
Rasm fayllari veb -sahifalardan alohida saqlanganligi sababli, brauzer ularni olish uchun alohida so'rovlar yuborishi kerak. Va agar sahifada rasmlar ko'p bo'lsa va tarmoqqa ulanish tezligi past bo'lsa, unda qo'shimcha fayllarni yuklab olish uchun ko'p vaqt kerak bo'ladi. Va bundan ham yomoni, agar tasvir siz bilmasdan serverdan olib tashlansa.
Bunday hollarda veb -sahifaning o'zi muvaffaqiyatli yuklanadi, tasvirlar o'rniga faqat oq to'rtburchaklar ko'rsatiladi. Shuning uchun, foydalanuvchiga tasvir nima ekanligini ma'lumot berish uchun u qo'llaniladi. Bu atribut rasm yuklanmaguncha bo'sh to'rtburchakda ko'rsatiladigan zaxira matnini bildiradi:
Va shunga o'xshash narsa quyidagicha ko'rinadi:
Rasmni o'lchash
Siz bilishingiz kerak bo'lgan img tag atributlari hali ham bor. Bu er -xotin atributlar kenglik va balandlik... Siz ulardan foydalanib, rasmning o'lchamlarini belgilashingiz mumkin:
Ikkala atribut ham o'lchamini ko'rsatadi piksel... Kenglik atributi brauzerga tasvir qanchalik keng bo'lishi kerakligini va balandlik atributi qanchalik balandligini bildiradi. Bu ikkita atributni birgalikda yoki alohida qo'llash mumkin. Masalan, agar siz faqat kenglik atributini ko'rsatsangiz, brauzer avtomatik ravishda balandlikni belgilangan kenglikka mutanosib ravishda tanlaydi va faqat balandlik atributidan foydalaniladi. Agar siz bu atributlarni umuman ko'rsatmasangiz, brauzer tasvirni ekranda aks ettirishdan oldin uning hajmini avtomatik ravishda aniqlaydi. Shuni ta'kidlash kerakki, tasvirlar hajmini ko'rsatish sahifani ko'rsatishda brauzerni biroz tezlashtiradi.
Bu hozircha rasmlarni sahifalarga kiritish haqida, keyin biz qanday qilib audio yoki videoni saytga kiritish kerakligini ko'rib chiqamiz ...
HTML 5 yordamida video va audio qo'shish
Yangi html5 spetsifikatsiyasi media fayllarni joylashtirishni osonlashtiradigan bir nechta yangi teglarni taqdim etadi. Bu birinchi navbatda video va audioga tegishli.
Qo'shish uchun audio HTML5 birlashtirilgan tegni beradi AUDIO... Audio klip saqlanadigan faylning manzili allaqachon tanish bo'lgan src atributi yordamida ko'rsatiladi:
"Audio" yorlig'i sahifada blok elementini yaratadi. Odatiy bo'lib, brauzer audio klipni ijro etmaydi. U buni qilishi uchun audio tegda maxsus atribut ko'rsatilishi kerak. avtomatik... Maxsus, chunki bu muhim emas. Tegda bu atributning mavjudligi uning kuchga kirishi uchun etarli.
Odatiy bo'lib, audioklip veb -sahifada hech qanday tarzda ko'rsatilmaydi. Ammo, agar siz "audio" tegiga qiymatsiz atributni qo'ysangiz nazorat qiladi, brauzer veb -sahifaning o'rniga audio teg qo'yilgan joyda, audioklipni ijro etish uchun boshqaruv elementlarini ko'rsatadi. Ularda ijro etish / to'xtatib turish tugmasi, ijro paneli va ovoz balandligi boshqaruvi mavjud.
Dars maqsadlari:
HTML gipermatnli belgilash tili haqidagi tushunchani kengaytirish va chuqurlashtirish;
grafikli veb -sahifalarni yaratish ko'nikmalarini shakllantirish;
mantiqiy fikrlashni rivojlantirish, tahlil qilish, solishtirish, tizimlashtirish, umumlashtirish ko'nikmalarini rivojlantirish.
Dars turi: yangi bilim va ko'nikmalarni o'zlashtirish darsi.
Talabalar bilishi kerak:
Notepad muharririda veb -sahifa yaratish
grafik bilan.
Darsning dasturiy va uslubiy ta'minoti:
Notepad muharriri;
"Informatika 11" darsligi, 3 -§ ( 3 .2); 6 -darsga ilovalar;
ESU W eb11 6.
1. O'tgan dars bo'yicha bilimlarni tekshirish (reproduktiv o'qitish usuli, individual va frontal ish shakllari).
Kompyuterda individual topshiriqlarni bajarish: o'qituvchi taklif qilgan matnni mashqdagi rasmga muvofiq tartibga solish.§3 ( 3 -band .1) imtiyozlar yoki ESU V eb11-5 .
Sizga taklif qiling Ko'pincha savollarga javob berish uchun: Hujjatlarning gipermatnli belgilanishi nima? HTML hujjatining tuzilishi qanday? Paragraf uchun teg nima? Yangi qator uzilishi? Qalin va kursiv belgilar uchun teglar nima? Butun veb -sahifaning fonini va matn rangini qanday sozlash mumkin? Qaysi teglar va atributlar harflarning shriftini, hajmini va rangini belgilaydi? Testdan foydalanish mumkin (6 -darsga ilova; ESA W eb11 5).
2. Bilimlarni aktualizatsiya qilish va talabalarni yangi materialni o'rganishga rag'batlantirish ( frontal ish shakli).
Yangi materialni frontal suhbat tarzida tushuntirishni boshlashdan oldin, grafik ob'ektlar veb -sahifalar dizaynidagi rolini muhokama qiling: fotosuratlar, chizmalar, fon rasmlari (fon rasmlari), ajratuvchi chiziqlar. Ular nafaqat sahifalarni yanada jozibali va ko'rgazmali qiladi, balki ko'p hollarda asosiy ma'lumot manbai hisoblanadi. Misollar ko'rsatish ( ESU W eb11 6).
Shuni ta'kidlash kerakki, veb -sahifalar uchun mo'ljallangan tasvirlarni turli tasvir muharrirlarida yaratish va tahrir qilish mumkin. Ularni raqamli kamera, skaner yoki Internetdan olish mumkin. Eng afzal ko'rilgan grafik formatlargif , jpg va png , fayllari kichik, bu esa yuklanish jarayonini tezlashtirishga imkon beradi. Buni sizga formatda eslatib turingjpg Odatda fotosuratlarni saqlang. Format gif animatsiya va oshkoralikni qo'llab -quvvatlaydi.
3. Yangi materialni tushuntirish (tushuntiruvchi-tasviriy o'qitish usuli qisman qidirish bilan birlashtirilgan , frontal ish shakli).
Savol bilan tushuntirishni boshlang: rasmlar veb -sahifaning o'zida saqlanadimi? NS Shuni ta'kidlash kerakki, veb -sahifada ko'riladigan barcha rasmlar alohida fayllarda saqlanadi va HTML -kod faqat ularga havolalarni o'z ichiga oladi. Yorliq rasmlarni ko'rsatish uchun mo'ljallangan.< img> , o'ziga xos atributi grafik fayl nomi.
Keyin, ba'zi teg atributlarining ta'sirini ko'rsating < img>. Shunday qilib, ekranda tasvirning balandligi va kengligi atributlarning qiymatlari bilan belgilanadibalandlik va kenglik, va atribut qiymati bo'yicha tasvir atrofidagi chegaraning qalinligichegara. Past darajadagi sinflarda buni o'qituvchi videoproyektor yordamida amalga oshiradi. Talabalarning etarli tayyorgarligi bilan siz ularga mustaqil tadqiqot o'tkazishni taklif qilishingiz mumkin, so'ngra natijalarni to'g'ridan -to'g'ri muhokama qilishingiz mumkin.
Shuni ta'kidlash kerakki, o'lchovlarni ko'rsatish sizga faqat ekranda ko'rinadigan tasvirni kattalashtirish yoki kamaytirish imkonini beradi (asl rasm va u saqlanadigan fayl o'zgarishsiz qoladi). Agar o'lchamlar aniqlanmagan bo'lsa, rasm yuklangach, ekrandagi matn va boshqa ob'ektlarning o'rni o'zgarishi mumkin. Shuning uchun bu atributlarni har doim aniq belgilash yaxshi amaliyotdir. Atribut qiymatlarihizalamoqmatnning rasmga mos kelishini yoki matn qanday oqayotganini ko'rsating.
Atributdan foydalanishboshqaxabar matnini o'rnatishingiz mumkinMen, agar u topilmasa yoki brauzerda displey o'chirilgan bo'lsa, rasm o'rniga ko'rsatiladi. Bundan tashqari, bu xabar sichqoncha kursori rasm ustida harakatlanayotganda ko'rsatma sifatida ko'rsatiladi. Atributlarni aniq ko'rsatish foydaliligini ko'rsatingbalandlik, kenglik va boshqastandart belgilash katakchasini olib tashlashingiz mumkinRasmlarni ko'rsatish tabda Qo'shimcha muloqot oynasiInternet imkoniyatlari.
Nihoyat, atribut yordamida veb -sahifaning fonida fayldan rasm ishlatilishini namoyish etingfon teg< tana>. qo'shimcha ravishda tabriknomani yaratishni taklif qiling (3 -misol) §3 ( 3.2) imtiyozlar, ESA W eb11 6 .
5. Darsni yakunlash
Talabalar yaratilgan sahifalarni namoyish qiladilar. Ishning bosqichlari va talabalarning qiyinchiliklari muhokama qilinadi.Xususiyatlar qisqacha tuzilgan veb -sahifalardagi rasmlardan foydalanish,
6. Uy vazifasi
Materialni o'rganing§ 3 ( NS. 3 .2 ) o'quv qo'llanma, 13 savollarga javob bering,2 -mashq vazifalaridan birini amalda bajarishga tayyorgarlik ko'rish
HTML rasmlar teg yordamida veb -sahifalarga qo'shiladi ... Grafikdan foydalanish veb -sahifalarni ingl. Rasmlar veb -hujjatning mohiyati va mazmunini yaxshiroq etkazishga yordam beradi.
HTML teglaridan foydalanish
HTML hujjatiga rasmlarni kiritish
1. Tag ![]()
Element alt atributi yordamida qo'shilgan tasvir va uning qaytariladigan tarkibini ifodalaydi. Elementdan beri
inline bo'lsa, uni blok elementi ichiga joylashtirish tavsiya etiladi, masalan
Yoki
Teg kerakli src atributiga ega, uning qiymati tasvirning mutlaq yoki nisbiy yo'li:
Tag uchun quyidagi atributlar mavjud:
| Xususiyat | Tavsif, qabul qilingan qiymat |
|---|---|
| boshqa | Alt atributi rasmga muqobil matn qo'shadi. U yuklanishidan oldin yoki grafik o'chirilgan paytda tasvir paydo bo'ladigan joyda ko'rsatiladi, shuningdek, sichqoncha kursorini rasm ustiga olib borganingizda asboblar paneli sifatida ko'rsatiladi. Sintaksis: alt = "(! LANG: tasvir tavsifi" . !} |
| o'zaro bog'liqlik | Crossorigin atributi CORS so'rovlari yordamida boshqa domendagi manbalardan rasmlarni yuklash imkonini beradi. Tuvalga CORS so'rovlari yordamida yuklangan rasmlarni qayta ishlatish mumkin. Ruxsat etilgan qiymatlar: anonim - o'zaro kelishuv so'rovi HTTP sarlavhasi yordamida amalga oshiriladi va hisob ma'lumotlari o'tkazilmaydi. Agar server tarkib so'raladigan serverga hisob ma'lumotlarini bermasa, tasvir buziladi va undan foydalanish cheklanadi. use-credentials-O'zaro kelib chiqish so'rovi hisobga olish ma'lumotlari berilgan holda amalga oshiriladi. Sintaksis: crossorigin = "anonim". |
| balandlik | Balandlik atributi tasvir balandligini piksellar soniga o'rnatadi. Sintaksis: balandlik = "300". |
| ism xaritasi | Ismap atributi bu rasm serverda joylashgan xarita tasvirining bir qismi ekanligini ko'rsatadi (xarita-tasvir-bosish mumkin bo'lgan joylar tasviri). Xarita tasvirini bosganingizda, koordinatalar serverga URL so'rovlar qatori sifatida yuboriladi. Ismap atributiga faqat element ruxsat berilgan Sintaksis: ism. |
| uzun bo'yli | Alt atributidan tashqari, tasvirning kengaytirilgan tavsifi uchun URL. Sintaksis: longdesc = "http://www.example.com/description.txt". |
| src | Src atributi tasvirga yo'lni ko'rsatadi. Sintaksis: src = "flower.jpg". |
| o'lchamlar | Displey parametrlariga qarab tasvir hajmini o'rnatadi. Faqat srcset atributi ko'rsatilganda ishlaydi. Atribut qiymati vergul bilan ajratilgan bir yoki bir nechta satrdir. |
| srcset | Ekran o'lchamlari asosida tanlanadigan tasvir manbalari ro'yxatini tuzadi. Src atributi bilan birgalikda yoki uning o'rniga ishlatilishi mumkin. Atribut qiymati vergul bilan ajratilgan bir yoki bir nechta satrdir. 
|
| foydalanuvchi xaritasi | Usemap atributi tasvirni tasvir xaritasi sifatida belgilaydi. Qiymat # belgidan boshlanishi kerak. Qiymat tegning nomi yoki id atributining qiymati bilan bog'liq |
| kenglik | Kenglik atributi tasvirning kengligini piksellar soniga o'rnatadi. Sintaksis: kenglik = "500". |
1.1. Rasm manzili
Rasm manzili to'liq ko'rsatilishi mumkin (mutlaq URL), masalan:
url (http://anysite.ru/images/anyphoto.png)
Yoki nisbiy yo'l orqali hujjat yoki ildiz katalogi sayt:
url (../ images / anyphoto.png) - hujjatning nisbiy yo'li,
url (/images/anyphoto.png) - bu ildiz katalogining nisbiy yo'li.
Bu quyidagicha izohlanadi:
../ - bir darajaga, ildiz katalogga ko'tarilishni anglatadi,
rasmlar / - rasmlari bo'lgan papkaga o'ting,
anyphoto.png - rasm faylini ko'rsatadi.
1.2. Rasm o'lchamlari
Rasm o'lchamini belgilamasdan, chizilgan sahifada haqiqiy o'lchamda ko'rsatiladi. Kenglik va balandlik atributlari yordamida tasvir o'lchamlarini o'zgartirishingiz mumkin. Agar atributlardan faqat bittasi o'rnatilgan bo'lsa, ikkinchisi rasmning nisbatlarini saqlab turish uchun avtomatik ravishda hisoblab chiqiladi.
1.3. Grafik fayl formatlari
JPEG formati (Fotosuratlar bo'yicha ekspertlar guruhi)... JPEG tasvirlari fotosuratlar uchun juda mos keladi, ular millionlab ranglarni o'z ichiga olishi mumkin. Tasvirlar GIF -larga qaraganda yaxshiroq siqiladi, lekin matn va katta rangli joylar qoralangan bo'lishi mumkin.
GIF formati (Grafik almashish formati)... Logotiplar kabi bir xil rangdagi maydonlarga ega tasvirlarni siqish uchun ideal. GIF -rasmlar sizga ranglardan birini shaffof qilib belgilash imkonini beradi, shunda veb -sahifaning fonini tasvirning bir qismi orqali paydo bo'ladi. GIF -lar oddiy animatsiyalarni ham o'z ichiga olishi mumkin. GIF -lar atigi 256 ta soyani o'z ichiga oladi, bu esa rasmlarni plakatlar kabi xira va haqiqiy bo'lmagan ko'rinishga olib keladi.
PNG formati (Portativ tarmoq grafikasi)... GIF va JPEG formatlarining eng yaxshi xususiyatlarini o'z ichiga oladi. 256 ta rangni o'z ichiga oladi va ranglardan birini shaffof qilish imkonini beradi, shu bilan birga tasvirlarni GIF faylidan kichikroq hajmda siqadi.
APNG formati (Animatsion portativ tarmoq grafikasi)... PNG formatidagi rasm formati. Animatsiyani saqlashga imkon beradi, shuningdek shaffoflikni qo'llab -quvvatlaydi.
SVG formati (Kengaytiriladigan vektorli grafikalar)... SVG chizig'i XML formatida tasvirlangan geometrik shakllar to'plamidan iborat: chiziq, ellips, ko'pburchak va boshqalar. Statik va animatsion grafikalar qo'llab -quvvatlanadi. Funktsiyalar to'plamiga turli xil o'zgartirishlar, alfa -niqoblar, filtr effektlari, andozalardan foydalanish qobiliyati kiradi. SVG tasvirlarini sifatini pasaytirmasdan o'zgartirish mumkin.
BMP formati (Bitmap rasm)... Bu to'rtburchaklar pikselli panjara bilan naqshlangan, siqilmagan (asl) bitmap. Bitmap fayli sarlavha, palitra va grafik ma'lumotlardan iborat. Sarlavhada grafik tasvir va fayl haqidagi ma'lumotlar (piksel chuqurligi, balandligi, kengligi va ranglar soni) mavjud. Palitra faqat palitra tasvirlari (8 yoki undan kam bitli) va 256 ta elementdan oshmagan Bitmap fayllarida ko'rsatiladi. Grafik ma'lumotlar rasmning o'zini ko'rsatadi. Rang chuqurligi bu formatda pikselga 1, 2, 4, 8, 16, 24, 32, 48 bit bo'lishi mumkin.
ICO formati (Windows belgisi)... Microsoft Windows -dagi fayl ikonkalarini saqlash formati. Bundan tashqari, Windows belgisi Internetdagi saytlarda belgi sifatida ishlatiladi. Bu brauzerda sayt manzili yoki xatcho'p yonida ko'rsatiladigan ushbu formatdagi rasm. Bitta ICO fayli bir yoki bir nechta ikonkalarni o'z ichiga oladi, ularning har birining o'lchami va rangi alohida belgilanadi. Belgining o'lchami har qanday bo'lishi mumkin, lekin eng keng tarqalgan piktogramma tomonlari 16, 32 va 48 pikselli kvadrat ikonkalardir.
2. Tag
Teg
Ism atributi xaritaning nomini ko'rsatadigan teg uchun mavjud. Teg uchun name atributining qiymati
Element
3. Teg
Teg mijoz tomonidagi tasvir xaritasida faqat bitta nuqta tasvirlangan. Elementda oxirgi teg yo'q. Agar bitta kirish nuqtasi boshqasiga to'g'ri kelsa, u holda doiralar ro'yxatidan birinchi havola amalga oshiriladi.
| Xususiyat | Qisqa Tasvir |
|---|---|
| boshqa | Xaritaning faol maydoni uchun muqobil matnni belgilaydi. |
| koordinatalar | Ekrandagi maydonning o'rnini aniqlaydi. Koordinatalar uzunlik birliklarida ko'rsatilgan va vergul bilan ajratilgan: uchun aylana- doira markazi va radiusi koordinatalari; uchun to'rtburchak- yuqori chap va o'ng pastki burchaklarning koordinatalari; uchun ko'pburchak- ko'pburchak cho'qqilarining koordinatalarini kerakli tartibda, rasmni mantiqiy to'ldirish uchun, birinchi koordinataga teng bo'lgan oxirgi koordinatalarni ko'rsatish tavsiya etiladi. |
| yuklab olish | Href atributini to'ldiradi va brauzerga manba yuklanishi kerakligini aytadi, masalan, foydalanuvchi havolani bosganda, masalan, uni oldindan ochish o'rniga (PDF fayli kabi). Atributga nom berish orqali biz yuklangan ob'ektga nom beramiz. Atributni uning qiymatini ko'rsatmasdan ishlatishga ruxsat beriladi. |
| href | Ulanish uchun URL manzilini belgilaydi. Mutlaq yoki nisbiy havola ko'rsatilishi mumkin. |
| hreflang | Bog'langan veb -hujjat tilini belgilaydi. Faqat href atributi bilan birgalikda ishlatiladi. Qabul qilingan qiymatlar - bu til kodini bildiruvchi juft harflardan tashkil topgan qisqartma. |
| ommaviy axborot vositalari | Fayl qaysi turdagi qurilmalar uchun optimallashtirilishini aniqlaydi. Qiymat har qanday ommaviy axborot so'rovi bo'lishi mumkin. |
| rel | Href atributini joriy hujjat va bog'langan hujjat o'rtasidagi munosabatlar to'g'risidagi ma'lumotlar bilan to'ldiradi. Qabul qilingan qiymatlar: muqobil - hujjatning muqobil versiyasiga havola (masalan, bosma sahifa, tarjima yoki oyna). muallif - hujjat muallifiga havola. xatcho'p - bu xatcho'plar uchun ishlatiladigan doimiy url. yordam - yordam uchun havola. litsenziya - ushbu veb -hujjat uchun mualliflik huquqi ma'lumotlariga havola. next / prev - individual URL -lar o'rtasidagi munosabatni ko'rsatadi. Ushbu belgi tufayli Google ushbu sahifalarning mazmuni mantiqiy ketma -ketlikda bog'langanligini aniqlay oladi. nofollow - qidiruv tizimining ushbu sahifadagi havolalarga yoki ma'lum bir havolaga kirishini taqiqlaydi. noreferrer - havoladan so'ng, brauzer HTTP so'rov sarlavhasini yubormasligi kerakligini bildiradi, bu saytga tashrif buyuruvchi qaysi sahifadan kelganligi haqidagi ma'lumotlarni yozib qo'yadi. oldindan o'rnatish - maqsadli hujjatni keshlash kerakligini ko'rsatadi, ya'ni. fonda joylashgan brauzer sahifaning tarkibini keshiga yuklaydi. qidirish - maqsadli hujjatda qidiruv vositasi borligini bildiradi. teg - joriy hujjatning kalit so'zini bildiradi. |
| shakl | Xaritadagi ulanish nuqtasi shaklini va uning koordinatalarini o'rnatadi. U quyidagi qiymatlarni olishi mumkin: to'g'ri - to'rtburchaklar shaklidagi faol maydon; doira - aylana shaklidagi faol maydon; poligon - ko'pburchak shaklidagi faol maydon; standart - faol maydon butun tasvir maydonini egallaydi. |
| nishon | Havolani kuzatishda hujjat qayerga yuklanishini ko'rsatadi. U quyidagi qiymatlarni oladi: _self - sahifa joriy oynaga yuklanadi; _blank - sahifa yangi brauzer oynasida ochiladi; _parent - sahifa yuqori freymga yuklanadi; _top - sahifa to'liq brauzer oynasiga yuklanadi. |
| turi | Murojaat qilingan fayllarning MIME turini belgilaydi, ya'ni. Fayl kengaytmasi. |
4. Tasvir xaritasini tuzishga misol
1) Biz asl tasvirni kerakli shaklning faol joylariga belgilaymiz. Hududlarning koordinatalarini fotosuratlarni qayta ishlash dasturi yordamida hisoblash mumkin, masalan, Adobe fotoshop yoki Bo'yamoq.
Guruch. 1. Xaritani yaratish uchun tasvirni belgilashga misol 2) Xaritaning nomini tegga qo'shib o'rnating
Jpg "alt =" (! LANG: flowers_foto" width="680" height="383" usemap="#flowers">
!}
Guruch. 2. Xarita-tasvirni yaratishga misol, sichqoncha kursorini gulga bosganingizda tavsifli sahifaga o'tasiz.
