Style boxShadow özelliği

Tanım ve kullanım

boxShadow Özellik, çubuğun yansımasını (drop-shadow) ayarlar veya döndürür.

Ayrıca bkz:

CSS referans el kitabı:box-shadow özelliği

Örnek

div elementine box-shadow ekleyin:

document.getElementById("myDIV").style.boxShadow = "10px 20px 30px blue";

Kişisel olarak deneyin

Gramer

boxShadow özelliğini döndürün:

nesne.style.boxShadow

boxShadow özelliğini ayarlayın:

nesne.style.boxShadow = "none|h-shadow v-shadow blur spread color |inset|initial|inherit"

Yorum:boxShadow Özellik, çubuğa bir veya daha fazla gölge ekler. Bu özellik, virgülle ayrılmış gölge listesidir, her gölge 2-4 adet uzunluk değeri, seçmeli renk değeri ve seçmeli 'inset' anahtar kelimesi ile tanımlanır. Uzunluk değerlerini atlamak 0'dır.

Özellik değeri

Değer Açıklama
none Öntanımlı değer. Gölge gösterilmez.
h-shadow Zorunludur. Yatay gölgenin konumu. Negatif değerlere izin verilir.
v-shadow Zorunludur. Dikey gölgenin konumu. Negatif değerlere izin verilir.
blur Opsiyonel. Bulanıklık mesafesi.
spread Opsiyonel. Gölgenin boyutu.
color

Opsiyonel. Gölgenin rengi. Öntanımlı değer siyah renktedir.

Bakınız CSS renk değerimümkün olan renk değerlerinin tam listesini alın.

İpucu:Safari'de (PC'de),color Parametreler zorunludur. Renk belirlenmezse, gölge görüntülenmez.
inset Opsiyonel. Dış gölgeleri (outset) iç gölgelere değiştir.
initial Bu özelliği öntanımlı değerine ayarlayın. Bakınız initial。
inherit Bu özelliği ebeveyn elementinden miras alır. Bakınız inherit。

Teknik ayrıntılar

Öntanımlı değer: Yok
Dönüş değeri: dize, elementin box-shadow özelliği。
CSS sürümü： CSS3

Tarayıcı desteği

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Destek 9.0 Destek 5.1 Destek