CSS esnek-şekil özelliği
Tanım ve Kullanım
flex-shrink özelliği aynı konteynırda sabitlenmiş olup, öğeler diğer esnek öğelere göre daralma miktarı belirler.
Yorum:Eğer element esnek bir öğe değilse, flex özelliği geçersizdir.
Ayrıca bakınız:
CSS Eğitimi: CSS Esnek Çerçeve
CSS Referans Kılavuzu:flex özelliği
CSS Referans Kılavuzu:flex-basis özelliği
CSS Referans Kılavuzu:flex-direction özelliği
CSS Referans Kılavuzu:flex-flow özelliği
CSS Referans Kılavuzu:flex-grow özelliği
CSS Referans Kılavuzu:flex-wrap özelliği
HTML DOM Referans Kılavuzu:flexShrink özelliği
Örnek
İkinci esnek öğeyi diğer öğelere göre üç kat daha fazla daraltır:
div:nth-of-type(2) {
flex-shrink: 3;
}
CSS dilbilgisi
flex-shrink: number|initial|inherit;
Özellik değeri
| Değer | Açıklama |
|---|---|
| number | Sayı, öğenin diğer esnek öğelere göre daralma miktarını belirler. Varsayılan değeri 1'dir. |
| initial | Bu özelliği varsayılan değerine ayarlar. Bakınız initial. |
| inherit | Bu özelliği ebeveyn elementinden devralır. Bakınız inherit. |
Teknik ayrıntılar
| Varsayılan değer: | 1 |
|---|---|
| Devralma: | Hayır |
| Animasyon yapımı: | Desteği var. Ayrıca bakınız:Animasyonla ilgili özellikler. |
| Sürüm: | CSS3 |
| JavaScript dilbilgisi: | object.style.flexShrink="5" |
Tarayıcı desteği
Tablodaki sayılar, bu özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtir.
İlk sürüm olarak -webkit- veya -moz- ön eklerini kullanan sayıları gösterir.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 29.0 21.0 -webkit- |
11.0 | 28.0 18.0 -moz- |
9.0 6.1 -webkit- |
17.0 |
