Menü Kapat

Veb səhifəyə şəkillərin əlavə olunması asan olub bir o qədər də üzərində çox işləməli proseslərdən biridir. Çünki şəkilə düzgün formatın verilməməsi, düzgün ölçü seçilməməsi veb səhifənin diqqət cəlb etmə xüsusiyyətinə xələl gətirə bilər. Bəzən elə olur ki, şəkillər özlərində çox böyük informasiya daşıyır və bu zaman düzgün şəkil veb səhifəni digərlərindən tamamilə fərqli gösdərər bilər.

Şəkil əlavə etmək üçün hansı elementlərdən istifadə etməli?

<img> elementi ingiliscədən image sözündən götürülmüş, şəkil mənasını verir. Bu elementin yalnız açılış teqi mövcuddur və qapanış teqinin slash (/) işarəsini də özünə daxil edir. <img> elementinin daxilində də bir neçə elementlərdən istifadə olunur. Bir nümunəni nəzərdən keçirdək: <img src=“ hansısa bir link” alt=“ Almaniya” title=“ Almaniya tibbin inkişaf etdiyi bir ölkə qismində”/>. Ən birinci istifadə olunan src atributunun qiyməti kimi gösdərilən link şəkilin veb adresidir və burada adətən ötən dərslərdə sözügedən əlaqəli URL-dən, yəni tam versiyasının qısaldılmış formasından istifadə olunur. Növbəti atribut alt atributudur. Onu qeyd etməli ki, şəkil Almaniya şəhərinin şəkili olub tiblə bağlı olan hər hansısa bir məqalə daxilində istifadə olunmuşdur. Bu zaman həmin şəkilin tekst şəklində olan izahı, yəni nə ilə bağlı olması alt atributunun qiyməti kimi gösdərilməlidir. Bəzən elə olur ki, özündə məna daşımayıb sadəcə dizayn xarakterli istifadə olunan şəkillərlə də rastlaşırıq. Bu zaman o şəkilə heç bir izah vermək təbii ki mümkün deyildir. Bunun üçün yenə də alt atributu <img> elementi daxilində mütləq və mütləq qeyd olunmalıdır, sadəcə dirnaq içi işarələri daxilində onun qiyməti kimi gösdərilən izah qeyd olunmur. Sonuncu istifadə olunan atribut isə title atributudur. Bu sadəcə orda əlavə məlumat vermək xarakterini daşıyır və həmçinin ondan istifadə olunmayan hallarla da rastlaşmaq mümkündür.

Hər bir istifadə olunan şəkilin özünəməxsus hündürlüyü və eni təbii ki vardır. Onları atribut şəklində <img> elementi daxilində qeyd etmək lazımdır. Bu zaman img elementi src atributu ilə başlayıb alt atributu ilə davam edib width yəni en, height– hündürlük atributları ilə sonlandırılır. Bu iki atributun qiyməti lazımi ölçülər məsələn, “100”, “300” və s. kimi rəqəmlərdən ibarət olur.  Bu ölçülər piksellərlə ifadə olunan ölçülərdir. Düzgün ölçünün olması çox önəmlidir. Çunki bəzən böyük ölçülü şəkillər veb səhifəyə daxil olarkən müəyyən qədər gecikmələrlə açılır.

Şəkillər və mətnlər arasında əlaqə:

  • Birinci növ şəkillər o şəkillərdir ki, onların uyğun mətnlə heç bir əlaqəsi yoxdur, yəni əvvəlcə şəkildən istifadə olunur, sonra isə şəkilin altından mətn başlayır. Bu zaman birinci <img /> elementi və onum daxilindəki atributları qeyd olunur. Və daha sonra isə mətni dxil etmək üçün <p>Mətn</p> qaydası izlənilir.
  • Bəzən də elə olur ki, mətnin birinci cümləsi uyğun şəkilin yanında, mətnin qalan hissəsi isə şəkilin altında qeyd olunur. Bu zaman <img> elementi ayriliqda deyil də, <p> elementinin açılış teqindən dərhal sonra qeyd olunur. Daha sonra img elementi və element daxili atributlar qeyd olunur, mətni daxil edib <p> elementinin qapanış teqini qeyd etmək lazımdır.
  • Üçüncü məqam isə ondadır ki, şəkillər bəzən də mətnin daxilində hansısa iki söz arasında istifadə olunur. Bu zaman həmin şəkil mətni iki hissəyə bölmüş olur. Bunun üçün də ilk öncə <p> elementinin açılış teqi daha sonra mətnin birinci hissəsi, <img> elementi atributları ilə birgə və sonda isə mətnin ikinci hissəsi və <p> elementinin qapanış teqi qaydası izlənilir.

align atributu növbəti bir atributdur ki, img elementi daxilində yazılır. Onun beş cür qiyməti vardır:

  1. left (sol)
  2. right (sağ)
  3. top (üst)
  4. middle (orta)
  5. bottom (aşağı).

İlk öncə align=“left” barədə danışaq. Bu zaman şəkil solda olub, bütün mətn isə onun yanından yazılır. Yəni yuxarıdaki qaydalar (şəkilin altında mətn və ya bir cümlə şəkil yanında qalan mətn isə şəkilin altında) daha burda tətbiq olunmur.

Right qiymətində isə atribut vasitəsilə şəkil sağ tərəfdə olub, bütün mətn isə şəkilin yanında qalan boş hissəyə yerləşdirilir.

Top, middle, bottom qiymətlərini müzakirə etmək üçün lazımi şəkili üç hissəyə bölünmüş şəkildə təsəvvür edək. Əgər qiymət top dursa, bu zaman mətnin birinci cümləsi şəkilin üst hissədən qabağında, qalan mətn isə şəkilin altında, əgər qiymət middle olarsa, bu zaman mətnin ilk cümləsi şəkilin mərkəzindən keçən xətt boyunca, qalan mətn isə şəkilin altında, və sonda əgər ki, qiymət bottom olarsa, bu zaman mətnin birinci cümləsi şəkilin alt hissədən qabağında, mətnin qalan hissəsi isə şəkilin altında qeyd olunur.