Etiket: border-box

CSS background-clip

background-clip:

Obje arkaplanın boyanacak bölümünü belirler.

Örnek:

#background-clip {
    border: 10px dotted black;
    padding: 35px;
    background: yellow;
    background-clip: padding-box;
}

See the Pen OyaRjM by W3TR (@w3tr) on CodePen.

Css Sözdizimi

Değer Açıklama
padding-box Arkaplan görüntüsü kenarlığın tam sol üst köşesinden boyar.
border-box Arkaplan görüntüsü kenarlığı yok sayarak tam objenin köşesinden boyar. Yani border yokmuş gibi davranır.
content-box Arkaplan görüntüsü iç boşluğunun sol üst köşesinden boyar.
initial
inherit

Tarayıcı Desteği
4.0 4.0 9.0 3.0 10.5
Posted on by Samed GÖZÜTOK 0

CSS background-origin

background-origin:

Arkaplan görüntüsünün içeriğin neresinden başlayacağını belirtir.

Örnek:

#background-orgin {
    border: 2px solid black;
    height: 400px;
    width: 50%;
    background: url(http://lorempixel.com/400/200/city/);
    background-repeat: no-repeat;
    background-origin: content-box;
}

See the Pen VvVKKN by W3TR (@w3tr) on CodePen.

Css Sözdizimi

Değer Açıklama
padding-box Arkaplan görüntüsü kenarlığın tam sol üst köşesinden başlar.
border-box Arkaplan görüntüsü kenarlığı yok sayarak tam objenin köşesinden başlar. Yani border yokmuş gibi davranır.
content-box Arkaplan görüntüsü iç boşluğunun sol üst köşesinden başlatır.
initial
inherit

Tarayıcı Desteği
4.0 4.0 9.0 3.0 10.5
Posted on by Samed GÖZÜTOK 0