|
Web sayfanıza Resim eklemek
|
|
Merhaba arkadaşlar,
Bakıyorum bayağı ilerlediniz.. Yakında beni bile geçeceksiniz.
Bu hafta sizlerle sayfamıza resim yerleştirmeyi öğrenelim... Size bir sır vereyim mi? Bu dersleri çalışırken winamp'ı açalım ve öyle çalışmaya başlayalım:) Böylece hem eğlenir hem öğreniriz ...
Sayfalarımızın daha güzel görünmesi için grafiklere ihtiyacımız vardır. Bu grafiklere biz resim diyelim:) Mesela buttonlar yaptık bunları nasıl yerleştireceğiz? Gelin şimdi bunu öğrenelim...
Resimleri sayfamıza yerleştirmeye yarayan etiketimiz img src="resmin adı" etiketidir. Tırnak işaretlerinin arasına koyacağımız resmin adını yazarız. Şimdi bunu bir örnekle gösterelim:
|
| Resim ekliyoruz |
|
<html>
<head>
<title>Sayfamızda Resim </title>
</head>
<body>
<p><img src="cicek.jpg">
</body>
</html>
|
Evet işte oldu sayfamıza resmimizi yerleştirdik. Ama şimdi sadece solda duruyor.
Ortaya ya da sağa hizalanması isteseydik, aşağıdaki kodları yazmamız gerekecekti.
Resmin ortaya hizalanması
|
| <img src="cicek.jpg align="center"> |
|
Resmin sağa hizalanması
|
| <img src="cicek.jpg" align="right"> |
|
|
Resmimizin boyutlarını da belirleyebiliriz.
Bunun için resmin genişliğini ve yüksekliğini yazmamız gerekir. "width=230 height=252" etiketlerini kodumuza ekleriz.
|
|
<img src="cicek.jpg" width=230 height=252>
|
|
Resmin üzerine gelince görünen yazı
Mouse'umuzu yani faremizi sayfamızdaki bir resmin ya da grafik unsurun üstüne getirdiğimizde görünen açıklama metni koyabiliriz. Bu metinde resmin adı, sitemiz hakkında bilgi bulunabilir.
|
<img src="cicek.jpg" width=230 height=252 alt="DayDay web sitene hoşgeldin  "> |
![DayDay web sitene hoşgeldin <img src=]() " src="http://www.webdersleri.com/web-internet/html/resim/misra.gif" />
Mısra'nın resminin üzerine gelin bakalım |
|
Şimdi bir hatırlatma... Resimlerimiz ile .htm dosyalarımız aynı klasörde olmalı. Yoksa resimlerimiz gözükmez. Onun yerine bir çarpı işareti görmekte pek hoş olmaz...
|
|
| |
| |
">
