HTML Resim Ekleme

Bu derste HTML kodlarıyla nasıl resim ekleyeceğimizi, nasıl boyutlandıracağımızı göreceğiz.

Resim dosyalarını almak için <img/> etiketi kullanılır. <img> etiketinin içinde birçok nitelik vardır. Bunlardan bahsetmek gerekirse;

src=””: Resmin dosya adı demektir. Eğer resim html dosyanızla aynı yerde değilse ya da herhangi bir klasörde ise o yoluda belirtmeniz gerekir. Resmin uzantısını(jpeg,png) eklerken dikkat edin.

width=””: Resmin genişliğini belirlemek için kullanılır.

height=””: Resmin uzunluğunu belirlemek için kullanılır.

alt=””: Resmin adını veya konumu yanlış verdiğiniz de ya da resim yüklenemediğinde resmin yerine yazılacak yazıyı belirtir.

Şimdi bir örnek yapalım. Daha kolay anlamış olacaksınız.


<html>

<head>

<title> Deneme Sayfası </title>

</head>

<body>

<img src="tavsan.jpg" width="200" height="300" alt="Bu bir tavşandır."/>

</body>
</html>

EKRAN ÇIKTISI:

Şimdi burda alt niteliğinin ne işe yaradığı belli olmadığı için, src kısmındaki resmin adını yanlış yazın ve daha sonra kodu çalıştırın.

Görüldüğü gibi hata olduğu zaman alt niteliğine yazdığımız yazı ekrana geldi. Bu derste bitti bir sonraki ders görüşmek üzere.

Furkan Aktaş

Bilgisayar Mühendisiyim. Microsoft MCSA Web Applications Sertifikasına Sahibim. Aktif iş hayatımda Full Stack .Net Developer olarak çalışmaktayım.

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir