HTML'ye nasıl resim eklenir

Yazar: Florence Bailey
Yaratılış Tarihi: 24 Mart 2021
Güncelleme Tarihi: 25 Haziran 2024
Anonim
Html Resim Ekleme
Video: Html Resim Ekleme

İçerik

Bir web sitesine veya sosyal medya sayfasına resim eklemek, bir sayfayı dekore etmenin harika bir yoludur. HTML (Köprü Metni İşaretleme Dili), web programlama için birçok özelliğe sahiptir, ancak görüntüleri eklemek için gereken kod son derece basittir.

adımlar

Yöntem 1/1: Görüntüyü HTML'ye Ekle

  1. 1 Resminizi, diğer sunucuların kaynakları kullanmasına izin veren Photobucket veya TinyPic gibi ücretsiz bir barındırma hizmetine yükleyin. Bazı sitelerde, bant genişliği ve sunucu alanı kapladığı için bu yasaktır.
    • Ücretli bir barındırma hesabınız varsa, resmi oraya yükleyin. Ücretsiz bir siteden daha güvenilirdir.
  2. 2 Bir metin düzenleyicide (örneğin, Not Defteri'nde) yeni bir belge veya sitede bir sayfa veya HTML'yi değiştirebileceğiniz bir profil açın.
  3. 3 Bir etiketle başlayın resim. Etiket resim single, yani bir bitiş etiketine ihtiyaç duymaz, ancak XHTML uyumluluğu elde etmek için bir boşluk ve eğik çizgi ekleyebilirsiniz.
    • resim />
  4. 4 Kullanılabilir birçok öğe vardır, ancak yalnızca kesinlikle gereklidir:kaynak... Resmin konumunu veya URL'sini gösterir.
    • img src = "Resim URL'si" />
  5. 5 Ardından, bir öğe eklemeniz gerekir alt. Görüntü herhangi bir nedenle yüklenmezse gösterilecek metinden sorumludur. Bu metin, ekran okuyucu kullanan görme engelli kullanıcılar tarafından da kullanılabilir.
    • İmleci resmin üzerine getirirseniz, geri dönüş metni eylemin açıklamasında gösterilir, ancak yalnızca Internet Explorer'da. Tarayıcılar arası çözüm (Firefox'ta çalışır ve benzeri.) - öğeyi kullan Başlık ek olarak alt... Adımları açıklamak istemiyorsanız bunu yapmayın.
    • Örneğin:img src = "Resim URL'si" alt = "her ihtimale karşı" title = "İşlem açıklaması" />
  6. 6 Şimdi elementler boy uzunluğu ve Genişlik görüntünün boyutlarını ayarlayabilir ve ayrıca piksel veya yüzde belirtebilirsiniz. Bu şekilde yeniden boyutlandırmanın görüntülenen resmi yeniden boyutlandıracağını, tarayıcının orijinal resim boyutunu yüklemeye devam edeceğini unutmayın. Resminiz çok büyükse, bir resim düzenleyici programında yeniden boyutlandırın, PicResize.com bunu yapacaktır.
    • img src = "Resim URL'si" alt = "Her ihtimale karşı" başlık = "İşlem açıklaması" yükseklik = "%50" genişlik = "%50" />
    • img src = "resmin URL'si" alt = "Her ihtimale karşı" başlık = "İşlem açıklaması" yükseklik = "25 piksel" genişlik = "50 piksel" />

İpuçları

  • Bu elemanların değeri ya piksel olarak ya da 1 ile 100 arasında bir yüzde olarak belirtilir.
  • Bir resim veya resim, üst, alt, orta, sağ, sol vb. öğelerle bir web sayfasında herhangi bir yere yerleştirilebilir.
  • hspace öğesi, sol veya sağ görüntüden yatay olarak beyaz boşluk oluşturmak için kullanılır. Vspace öğesi - üst veya alt.
  • Görüntülerle aşırıya kaçmayın, her şey kaotik ve profesyonelce görünmeyecek.
  • GIF görüntüleri logolar ve çizgi filmler için uygundur, JPEG ise yüksek kaliteli fotoğraflar gibi karmaşık görüntüler için daha iyidir.
    • GIF görüntüleri 8 bit renkten 256 renge kadar destekler. Fotoğraflar için bu formatı kullanarak, kalitede bir şey kaybedersiniz.
    • GIF görüntüleri şeffaflığı destekler. Bir bit şeffaflık olabilir, yani bir renk şeffaf hale getirilebilir.
    • Araya ekleme de desteklenir, yani. kullanıcı, yüklemeden önce bile görüntünün nasıl görüneceğini tahmin edebilir.
    • GIF formatı da animasyonu destekler.

Uyarılar

  • Hotlink yapmayın!