Html Arka Plan Resmi Uygulaması | Barış ÖZCAN Web Tasarım | antalya web tasarım | antalya web tasarımı | Sosyal Medya Danışmanlığı https://www.barisozcan.net Fri, 03 Dec 2010 18:33:11 +0000 tr hourly 1 https://wordpress.org/?v=6.9.4 Web Tasarım Dersleri Border ve Sayfaya Arkaplan Resmi https://www.barisozcan.net/web-tasarim-dersleri-border-ve-sayfaya-arkaplan-resmi https://www.barisozcan.net/web-tasarim-dersleri-border-ve-sayfaya-arkaplan-resmi#respond Fri, 03 Dec 2010 18:33:11 +0000 http://www.barisozcan.net/?p=733 Bu dersimizde sizlere resimlere çerçeve (border) eklemeyi ve sayfamızda resimlerden arkaplan görüntüsü oluşturmayı anlatacağım değerli arkadaşlar. Resimlere Çerçeve Border Ekleme Sayfanıa eklediğiniz resimlere kenarlık uygulayabilirsiniz arkadaşlar. Kenarlık (border) ekleyebilmek için <img etiketi içinde border parametresi kullanılarak yapılır. Border parametresinde değer sayısal olarak belirtilmelidir sayısal değer yükseldikçe resim borderimizinde kalınlığı artar sanki resim çerçevesinin kenarlarına benzer […]

The post Web Tasarım Dersleri Border ve Sayfaya Arkaplan Resmi first appeared on Barış ÖZCAN Web Tasarım | antalya web tasarım | antalya web tasarımı | Sosyal Medya Danışmanlığı.

]]>

Bu dersimizde sizlere resimlere çerçeve (border) eklemeyi ve sayfamızda resimlerden arkaplan görüntüsü oluşturmayı anlatacağım değerli arkadaşlar.

Resimlere Çerçeve Border Ekleme

Sayfanıa eklediğiniz resimlere kenarlık uygulayabilirsiniz arkadaşlar. Kenarlık (border) ekleyebilmek için <img etiketi içinde border parametresi kullanılarak yapılır. Border parametresinde değer sayısal olarak belirtilmelidir sayısal değer yükseldikçe resim borderimizinde kalınlığı artar sanki resim çerçevesinin kenarlarına benzer arttıkça

Border Uygulaması

Şimdi açıyoruz not defterimizi ve aşağıdaki kodları yazıyoruz daha önceki derslerde 2 ders resim eklemeyi anlattığım için burada değinmeyeceğim sizde kendi bilgisayarınızdan bir resim ekleyin farklı kaydet diyerek dosya adı border1.html olarak masaüstüne kaydedin.

<html>
<head>
<title>Web Tasarım Dersleri Resimlere Border Ekleme Ders 10</title>
</head>

<body>
<img src=”gul.jpg” border=”3″>
</body>
</html>

Aşağıdaki görüntü resin bordersiz hali ve onun altında border değeri 3 olarak verilmiş bir örnek göreceksiniz.

Resimin Bordersiz GörünümüResimin Bordersiz Görünümü

Border Değeri 3 Olarak Atanmış Resim GörüntüsüBorder Değeri 3 Olarak Atanmış Resim Görüntüsü

Evet arkadaşlar yukarda standart olarak border eklemeyi gördük birde bunlara şekil ve renk olayı var arkadaşlar bunu yapabilmek içinse style prametresini kullanacağız bunun için hazır örnekler mevcut onları kullanabiliriz nedir bu örnekler aşağıda görelim.

  • Dashed: Kesik Çizgili Border Oluşturmak İçin Kullanılır.
  • Dotted: Noktalı Border Oluşturmak İçin Kullanılır
  • Solid: Sürekli Çizili Kenarlık Oluşturmak İçin Kullanılır
  • Double: Çift Çizgili Border Oluşturmak İçin Kullanılır
  • Groove: Kabarık Border Oluşturmak İçin Kullanılır
  • Ridge: bir üstte yer alan Groovenin tam tersi işlem yapar

Border Style Uygulaması

Ben yukardaki stylelerden sadece ikitanesini uygulayacam arkadaşlar siz hepsini deneyin görün uygulamamda solid ve dashed stiline yer vereceğim aşağıdaki kodları uygulayıp dosya adı border2.html olarak masaüstüne kaydedin arkadaşlar.

<html>
<head>
<title>Web Tasarım Dersleri Resimlere Border Ekleme Ders 10</title>
</head>

<body>
<img src=”gul.jpg” style=”border:solid 3 red”>   <br><br>

<img src=”gul.jpg” style=”border:dashed 5 green”>
</body>
</html>

Html Border StyleHtml Border Style

Evet arkadaşlar yukardaki iki örnek solid ve dashed stylelerini kulanılmış resimlerdir şimdide sayfamızda resimlerden arkaplan yapmayı görelim Allahın izniyle.

Arka Plan Resmi  <background>

Daha önce sayfamızın arkaplanına renk uygulamasını görmüştük bu seferde renk yerine arka plan resmi yani resimden sayfamıza arka plan oluşturmayı göreceğiz arkadaşlar.

Dikkat etmeni gereken resim seçimidir resim küçük ise ekranı kaplaması gerektiği için o resmi çoğaltacaktır ama resim büyükse çoğaltma gereği duymaz hemen bir uygulama yapalım Aşağıdaki uygulamayı yapıp dosya adı arkaplanresmi.html olarak kaydedin arkadaşlar.

<html>
<head>
<title>Web Tasarım Dersleri Sayfada Arka plan Resmi Ders 10</title>
</head>

<body background=”gul.jpg”>

</body>
</html>

Html Arka Plan Resmi UygulamasıHtml Arka Plan Resmi Uygulaması

Bugünkü Dersimizde Bu kadar arkadaşlar resimleri tamamen geçmiş bulunmaktayız yapamadığınız kafanıza takılanı yorum şeklinde sorabilirsiniz unutmayın öğrenmeden geçmeyin sıkılırsınız mutlaka öğrenerek başararak geçin bir sonraki dersimiz bağlantılar (linkler olacak)

Gelen aramalar :

The post Web Tasarım Dersleri Border ve Sayfaya Arkaplan Resmi first appeared on Barış ÖZCAN Web Tasarım | antalya web tasarım | antalya web tasarımı | Sosyal Medya Danışmanlığı.

]]> https://www.barisozcan.net/web-tasarim-dersleri-border-ve-sayfaya-arkaplan-resmi/feed 0