HTML

Html Arka Plan Resmi Ayarlama

Html arka plan resmi

Html sayfaya arka plan nasıl eklenir? Bu dersimizde Html sayfamıza en basit şekilde arka plan resmi eklemeyi göreceğiz.

Bir önceki dersimizde HTML ARKA PLAN RENGİ AYARLAMA konusunu öğrenmiştik. Arka plan rengi eklemek için sayfamızın gövde kısmı olan <body> etiketinden faydalanmıştık. Burada da bizim yine aynı etiketi kullanmamız gerekecektir.

Body etiketinin “background” özelliğini kullanarak HTML sayfamıza arka plan verebiliriz. Background kelime olarak da Türkçe’ye çevrildiğinde arka plan anlamına gelmektedir. Yapmamız gereken ikinci kısım ise resmin adresini (yolunu) belirtmek olacaktır. Bunu da iki farklı yöntem ile yapabiliriz. Öncelikle aşağıdaki örnek kodlarımızı inceleyelim ve detaylandıralım.

Html Arka Plan Resmi Ekleme 1:

Html Arka Plan Resmi Ekleme 2:

Örneğin Ekran Görüntüsü:

Html arka plan resmi

Yukarıdaki iki kod örneğimizde de çalışma mantığı aynıdır, aralarındaki tek fark dosya yolunu yani resim adresini belirtme şeklimiz olmuştur.

Birinci örnekte; sadece resim adını ve uzantısını belirttiğimizi görüyoruz. Eğer; arka plan resmi yapacağımız resim HTML dosyamızın bulunduğu klasörde ise bu yöntemi kullanabiliriz. Veya ilgili klasörün bir alt klasöründe ise; örneğin HTML sayfamızın bulunduğu klasörün içinde “resimler” adında bir klasör var ve arka plan resmimiz bu klasörün içerisinde. Bu durumda (background=”resimler/arkaplan.jpg”) şeklinde kullanım gerçekleştirebiliriz.

İkinci örnekte; bir internet sitesindeki resmin url’sini tamamen yazdığımızı görmekteyiz. Bu yöntemde internette mevcut olan bir resmi de kolayca kullanabiliriz. Yapmamız gereken resim adresini background içerisine eksiksiz, doğru bir şekilde yazmak olacaktır.

İsteğe göre iki yöntemle de kullanım gerçekleştirilebilir. Ancak arka planlar bir internet sitesinin sabit temel elemanlarından biri olduğu için bir web tasarımcının birinci yöntem ile çalışmasını tavsiye edebiliriz.

+1000 Abone Arasına Katılmak İster misin?

Yeni yazıları kaçırmamak için mail sistemimize abone olabilirsiniz.

Abonelik İçin Teşekkürler!

Hata Var! Daha Sonra Deneyebilirsiniz!

Yorum Yap