CSS3 background-origin Özelliği

CSS3 background-origin

Css background-origin özelliği ile arka plana eklenen resmin konumlandırılması sağlanabilir.Resmin kenar çizgisine ,padding alanına veya içerik kısmına göre konumlanıp konumlanmayacağı kontrol edilebilir.

Örnek:

Bu örnekte arka plana eklenecek olan resim border,padding ve content "kenar çizgisi,boşluk alanı ve içerik alanına " göre konumlanacaktır.

#örnek2 { border: 9px dashed blue; padding: 50px; background: url('html-css.png'); background-repeat: no-repeat; background-origin: border-box; }

CSS3 background-origin nedir nasıl kullanılır

Css background-origin ile arka zemine eklenecek olan resimleri içerik alanına ,boşluk alanına ve kenar çizgisine göre konumlandırmak için kullanabiliriz..
CSS background-origin CSS background-origin özellikleri  
Varsayılan Değer: padding-box  
Kalıtsallık: yok  
Animasyon Özelliği: yok  
Versiyon: CSS3  
JavaScript background-origin: object.style.backgroundOrigin="content-box"

CSS background-origin Tarayıcı Desteği

CSS Kodu:
background-origin 4.0 9.0 4.0 3.0 10.5

CSS3 background-origin Değerleri

background-origin:padding-box|border-box|content-box|initial|inherit;

CSS3 background-origin özelliği değerleri

CSS background-origin values CSS background-origin değerleri tanımları CSS Örnek Uygulamalar
padding-box Eğer padding alanı tanımlanmışsa ,arka plana eklenecek olan resim bu kısıma konumlanacaktır.
border-box Arka plana eklenecek olan resim html elemanının kenar çizgisini referans alır.
content-box Arka plan resmi içerik alanına konumlanır.
initial Özelliğin varsayılan değeridir.
inherit Soybağından gelen özelliği taşır.  

Yorumlar

Bu blogdaki popüler yayınlar

HTML Resimler

HTML yorum etiketi ile öğe gizleme örneği

Eski tarayıcılarda kod gizleme ve kod satırını bölme Javascript

HTML5 Canvas Oyun Yapımı Dersleri

YouTube Reklam Engelleyici

Uyurken Bile Para Kazanmak İster misin

javascript ile aciklama satiri ve haftanın gunünü bulma

Linklerin Renklerini Değiştirme Örnek