HTML Görsel Ekleme
HTML sayfanıza görsel eklemek mi istiyorsunuz? İşte ihtiyacınız olan her şey bu konumuzda.
HTML Görsel (Resim) Nasıl Eklenir?
HTML'de <img> etiketi, bir web sayfasına görüntü eklemek için kullanılır.
<img> Etiketi herhangi bir kapanış etiketi almaz.
<img> Etiketi, iki ana niteliğe sahiptir. Bunlar;
- src - Resmin yolunu belirtir.
- alt - Görüntü için alternatif bir metin belirtir.
Sözdizimi şu şekildedir:
<img src="url" alt="metin">
Src Özelliği
Bu özellik web sayfasında kullanacağımız görselin yolunu belirtir.
<img src="avatar.jpg" alt="Onur KUL">
Alt Özelliği
Bu özellik ile görselimize metin tanımlarız. Eğer bir durumdan dolayı sayfamızdaki görsel görüntülenemezse, bu tanımlamış olduğumuz metin görüntülenecektir.
<img src="avatar.jpg" alt="Onur KUL">
Görsel Boyutu Ayarlama
Web sayfamızda kullanmış olduğumuz görselin boyutunu ayarlamak istiyorsak width ve height nitelikleri ile görsel boyutumuzu ayarlayabiliriz. Bu nitelikleri 2 şekilde kullanabiliriz gelin örnekler ile inceleyelim.
Örnek 1:
<img src="avatar.jpg" alt="Onur KUL" style="width:500px;height:600px;">
Örnek 2:
<img src="avatar.jpg" alt="Onur KUL" width="500" height="600">
Başka Klasördeki Görseli Kullanma
Görsellerimiz bir alt klasörde bulunuyorsa, src özelliğine klasör adını eklememiz gerekecektir.
<img src="/img/avatar.jpg" alt="Onur KUL" style="width:128px;height:128px;">
Başka Sunucudaki / Web Sitesindeki Görüntüleri Kullanma
Başka bir sunucudaki bir görseli kullanmak istiyorsak, src özelliğinin içerisine görselimizin URL'sini eklememiz gerekiyor.
<img src="https://onurkul.com.tr/img/avatar.jpg" alt="Onur KUL">
Tepkiniz Nedir?