CSS – Box-Shadow Özelliği Kullanımı Ve Örneği

CSS’de nesnelere gölge efekti uygulamak için en sık kullanılan css özelliklerinden biridir. Bu makalemizde css box shadow özelliğini örnekli olarak sizlere anlatmaya çalışacağım.

CSS – Box-Shadow Özelliği

Syntax – Sözdizimi

Box-Shadow özellikleri

ÖzellikeAçıklama
nonebox-shadow özelliğinin olmayacağını belirtmek için kullanıyoruz
yatay-gogleyatayda gölgenin nesneye olan uzaklığı
dikey-golgedikeyde gölgenin nesneye olan uzaklığı
bulanıklıkgölgenin bulanıklık oranı
yayılmagölgenin yayılma oranı
renkgölgenin rengi(hex,rgba,safe colours, rgb, hsl, hsla)
insetiç gölge oluşturmak için kullanılmalı
initial
inherit

Örnek

Örneğimizde bir p içerisine R yazdırıp p etiketi classına’da box-shadow’umuzun bulunduğu ornek-r adlı class’ımızı yazacağız sonucu ise Altta sonuc kısmında Result sekmesinden görebilirsiniz.

Html Kodu

Css Kodu

Sonuç

İçeriği puanla diğer kullanıcılara ışık tut

Murat Öner sitesinden daha fazla şey keşfedin

Okumaya devam etmek ve tüm arşive erişim kazanmak için hemen abone olun.

Okumaya Devam Edin