HTML Ders2- link ve resim ekleme


Html de sayfamızı bir önceki yazımızda nasıl açacağımızı dile getirmiştik. Bugünkü konumuz html sayfalarımıza link, resim ekleme kısmını anlatacağım.

Link ekleme

Bildiğiniz gibi web sitelerinde linkler yardımıyla sizi başka bir yere yönlendirme işlemi yapılır. Bunun Asp.Net bilenler için kolay olacağını düşünüyorum. Eğer html sayfalarınızda link vermek istiyorsanız

 <a></a> 

etiketleri arasında yazmalısınız. Hemen bir örneğimiz ile başlayalım.

<!DOCTYPE html>
<html>
<head>
  <title>linkler</title>
  <meta charset="utf-8">
</head>
<body>
<p><a href="http://www.tasarlagelistir.com" target="_blank">buraya </a> tıklarsan seni Tasarla Geliştir web sitesine yönlendireceğim. </p>
</body>
</html>

Çıktısı

href ile sayfanın yönleneceği url adresini yazdık. Bu kodumuz buraya kelimesine tıkladığı zaman yönlendirme işlemi yapacağı yeri anlatmaktadır. target=”_blank” ile de sayfa boş bir pencerede açılır.

Resim ekleme

Html belgemize resim eklemek için

<img>

kodumuzu kullanırız.

<!DOCTYPE html>
<html>
<head>
  <title>linkler</title>
  <meta charset="utf-8">
</head>

<body>
<img src="logo.png" alt="sumeyraakbiyik.com" width="200" height="100">
</body>
</html>

Çıktısı

Buradaki src=”” özelliği resmin dosya adını yazdığımız yerdir. Eğer eklediğiniz resim html dosyanızla aynı yerdeyse direk resmin adını yazabilirsiniz. Ama resimleriniz başka bir klasörde toplanmış ise klasörünüzün adını yazmanız gerekecektir. src yerine “klasor/resim.jpg” şeklinde yazmalısınız. Widht ve height ile resimlerinize boyut verebilirsiniz.

Eğer resminizi başka bir siteden çekecekseniz resminizin yolunu belirtmek için http:// adresini yazmalısınız ve bu yol resim formatında olmalıdır. Aynı zamanda resimlerimize alt özelliği ile fare ile resmin üzerine gelindiği zaman resim bilgisine de erişebilirler.

Resimlerimize link de verebiliriz. Bunun için aşağıdaki kodu kullanabilirsiniz.

<a href="http://www.sumeyraakbiyik.com/"><img src="logo.png" width="200" height="100"/></a>

Bir yorum ekleyin

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir