HTML ilə şəkil əlavə edin

Müəllif: Christy White
Yaradılış Tarixi: 4 BiləR 2021
YeniləMə Tarixi: 1 İyul 2024
Anonim
HTML Dərsləri - 05 - Səhifəyə Şəkil Əlavə Etmək, İMG Teqi
Videonuz: HTML Dərsləri - 05 - Səhifəyə Şəkil Əlavə Etmək, İMG Teqi

MəZmun

Veb saytınıza və ya sosial şəbəkə profilinizə şəkillər əlavə etmək veb səhifənizi bəzəmək üçün əla bir yoldur. HTML (HyperText Markup Language) veb səhifələr yaratmaq üçün bir çox funksiyaya malikdir, lakin xoşbəxtlikdən şəkillər əlavə etmək üçün lazım olan kod çox çətin deyil.

Addımlamaq

Metod 1-dən 1: HTML ilə Şəkillər daxil etmək

  1. Təsvirinizi isti əlaqəyə imkan verən Photobucket və ya TinyPic kimi pulsuz bir hosting veb saytına yükləyin. İsti bağlantı bir görüntünün veb sayt serverinə birbaşa keçidini təmin edir; bəzi provayderlər bunu qadağan etdi, çünki isti bağlantı onların bant genişliyindən istifadə edir və serverlərində yer tutur.
    • Ödənişli bir hosting hesabınız varsa, şəkilləri birbaşa veb saytınızın yerləşdiyi serverə yükləyin. Bu, həmişə pulsuz saytdan daha etibarlıdır və heç baha olmalı deyil.
  2. Mətn redaktorunda yeni bir sənəd açın (məs., Not Defteri / Not Defteri) və ya veb kodunuzu / profilinizdə HTML kodunu birbaşa dəyişdirə biləcəyiniz səhifəni açın.
  3. İlə başlayın img etiket. The img etiket boşdur, yəni bağlanma etiketinə ehtiyac yoxdur. Bununla birlikdə, XHTML doğrulaması üçün hələ bir boşluq və qarşısında bir əyri qoya bilərsiniz daha böyük işarəsi.
    • img />
  4. Mövcud bir çox xüsusiyyət var, ancaq yalnız biri vacibdir:src. Bu, görüntünüzün yeri / ünvanı və ya URL'sidir.
    • img src = "Şəklin URL-si" />
  5. Bundan sonra məcburiyyətindəsiniz alt atribut əlavə edin. Bu, şəkil yüklənə bilməyəcəyi təqdirdə alternativ bir mətn göstərir. Bu həm də ekran oxuyucularından istifadə edən zəif görənlər üçün bir xidmətdir.
    • İmleci bir şəkilin üzərinə aparsanız, bu mətn həm də bir ipucu kimi göstərilir, lakin bu yalnız Internet Explorer-dədir. Bütün brauzerlərlə işləyən həll (Firefox və s.) buna aiddir başlıq əlavə olaraq istifadə ediləcək atribut alt. (Görüntünün bir ipucu olmasını istəmirsinizsə, ikincisini buraxa bilərsiniz.)

Nümunə olaraq:img src = "Şəklin URL-si" alt = "Hər ehtimala qarşı" title = "Tooltip" />


  1. İndi şəklin ölçüsünü. İlə göstərə bilərsiniz hündürlükeni atribut və piksel və ya faiz göstərilməklə. Diqqət yetirin ki, bu şəkildə ölçüsünü dəyişdirmək görüntünün ölçüsünü deyil, yalnız görünüş ölçüsünü dəyişir. Bir görüntünün yüklənmə müddətini qısaltmaq üçün, xüsusən də böyük şəkillərlə, şəkil tənzimləmə proqramı ilə və ya PicResize.com kimi bir onlayn xidmət ilə əvvəlcədən onların ölçüsünü dəyişdirmək daha yaxşıdır.
    • img src = "Şəklin URL-si" alt = "Hər halda" title = "Tooltip" height = "50%" width = "50%" />
    • img src = "Şəklin URL-si" alt = "Hər halda" title = "Tooltip" height = "25px" width = "50px" />

Göstərişlər

  • Bu atributların dəyəri ya piksellə, ya da faizlə 1-100% arasında verilir.
  • Üst, alt, orta, sağ, sol və s. Kimi müxtəlif formatlaşdırma atributlarından istifadə edərək, şəkil veb səhifənin istənilən yerində yerləşdirilə bilər.
  • Hspace atributu bir görüntünün soluna və sağına üfüqi boşluq qoymaq üçün, vspace atributu isə şəkillərin və digər obyektlərin yuxarı və aşağı hissələrində yer ayırmaq üçün istifadə olunur.
  • Şəkillərlə çox əylənməyin. Bu dağınıq və qeyri-peşəkar görünür.
  • GIF şəkilləri loqotiplər və ya cizgi filmləri üçün yaxşıdır, lakin bu fayl növü bir çox rəngə sahib fotoşəkillər və digər şəkillər üçün daha az uyğundur.
    • GIF şəkilləri yalnız bir şəkil üçün maksimum 256 rəng ilə 8 bit rəngini dəstəkləyir. Bu səbəbdən 16 və ya 24 bitlik rəngli illüstrasiyanın və ya fotoşəklin çoxalmasının o qədər də yaxşı olmayacağı gözlənilir.
    • GIF şəkilləri şəffaflığı da dəstəkləyir. Bir az şəffaflıq mümkündür, yəni bir rəng şəffaf ola bilər.
    • Interlacing də GIF şəkilləri tərəfindən dəstəklənir, yəni sayt ziyarətçisi görüntünün tamamilə yüklənmədən əvvəl necə olacağı barədə bir fikir əldə edəcəkdir.
    • GIF formatı animasiyanı da dəstəkləyir.
  • URL-də şəklin fayl formatını göstərdiyindən əmin olun (.webp .gif və s.).

Xəbərdarlıqlar

  • Hotlink etməyin!