box-shadow
Elemanın kutusuna gölge ekler. Virgülle birden çok gölge verilebilir; içe doğru gölge için `inset` kullanılır.
Katalogdaki 4.198 efekt bu özelliği kullanıyor.
Sözdizimi
box-shadow: [inset] <x> <y> <bulanıklık> <yayılma> <renk> [, ...];Dikkat
Odak halkası için `outline` yerine `box-shadow` kullanmak `border-radius`'a uyum sağlar, ama Windows yüksek kontrast modunda kaybolur. Erişilebilirlik için `outline` ile birlikte düşün.
Sık kullanılan değerler
0 12px 30px rgba(0,0,0,.24)- Yumuşak yükselti gölgesi
inset 0 1px rgba(255,255,255,.2)- Üstten gelen ışık çizgisi
0 0 0 3px rgba(59,130,246,.4)- Odak halkası — bulanıklık 0, yayılma pozitif
box-shadow kullanan efektler
Katalogda ara Hepsi çalışan gerçek efektler. Kartın üzerine gel, kaynağını görmek için aç.