CSS box-shadow Özelliği Nedir ve Nasıl Kullanılır?
CSS box-shadow özelliği sayesinde HTML elemanlarına gölge vermek mümkündür. CSS3 öncesinde bunu gerçekleştirmek bir hayli zor iken artık tek bir özellikle kolaylıkla yapılabilmektedir.
Yapısı: box-shadow: <değer>
Aldığı Değerler: none | gölge
Başlangıç Değeri: Tanımlama yok
Uygulanabilen Elementler: Tüm elementler
Kalıtsallık: Yok
CSS box-shadow özelliğinin genel kullanım şekli;
.golge
{
box-shadow: 3px 3px 4px #000;
}
Değerler metinlere gölge verme (text-shadow) özelliği ile aynı anlamı taşır.
3px; İlk değer yataydaki mesafe içindir. Artı değerler kutunun sağından itibaren uzaklık değeridir. Negatif değerler kutunun soluna doğru mesafeyi gösterir.
3px; İkinci değer dikeydeki mesafe içindir. Artı değerler kutunun altına doğru mesafeyi gösterir. Negatif değerler ise kutunun üstüne doğru mesafesini gösterir.
4px; Bulanıklık (blur) değeridir. Gölgelerin gerçeğe yaklaşması için kullanılır. Bulanık yatay ve dikey için verilen değerler göre şekil alır.
#000; renk değeri. Gölgenin renk değerini gösterir.
CSS box-shadow özelliği konusunu gördük. Konu ile ilgili soru, öneri ya da fikirlerinizi aşağıda bulunan yorumlar kısmına yazarak bize iletebilirsiniz. CSS ile ilgili konuları aşağıdaki linke tıklayarak CSS kategorisi altındaki başlıklardan öğrenebilirsiniz. Ayrıca aşağıdaki Instagram ve Twitter logolarına tıklayarak bizi Instagram ve Twitter üzerinde de takip edebilirsiniz.
https://yazilimdelisi.com/category/web-gelistirme/css/
Sosyal Medya Hesaplarımız
