CSS flex-basis Özelliği

CSS flex-basis

Css flex-basis :Esnek kutu modelinde optimum boyutunu belirlemek için kullanılır. Eğer yeterli genişlik var ise esnek kutu verilen değer boyutunda olacaktır.

Örnek:

Bu örnekte anaka kutu içerisindeki bütün elemanlara başlangıç uzunluğu 40pxverilmiştir.2. sıradaki elemanının genişliğini ise 90px olarak değiştirdik.

#anakutu div { -webkit-flex-grow: 0; -webkit-flex-shrink: 0; -webkit-flex-basis: 40px; flex-grow: 0; flex-shrink: 0; flex-basis: 40px; } #anakutu div:nth-of-type(2) { -webkit-flex-basis: 90px; flex-basis: 90px; }

CSS flex-basis nedir nasıl kullanılır

Flex-basis özelliği sayısal olarak uzunluk yani genişlik tanımlamıza yarar.

CSS flex-basis CSS flex-basis özellikleri  
Varsayılan Değer: auto  
Kalıtsallık: yok  
Animasyon Özelliği: var  
Versiyon: CSS3  
JavaScript flex-basis: object.style.flexBasis="250px"

CSS flex-basis Tarayıcı Desteği

CSS Kodu:
flex-basis 29.0
21.0 -webkit-
11.0 28.0
18.0 -moz-
9.0
6.1 -webkit-
17.0

CSS flex-basis Değerleri

flex-basis:number|auto|initial|inherit;

CSS flex-basis özelliği değerleri

CSS flex-basis değerleri CSS flex-basis değerleri tanımları CSS örnek uygulamalar
number Esnek öğenin ilk uzunluğunu belirten bir uzunluk birimi girilir veya yüzde değeri yazılır.
auto Varsayılan değer. Uzunluk esnek öğenin uzunluğuna eşittir .
initial Özelliğin varsayılan değeridir.
inherit Soybağından gelen değerdir.  

Yorumlar

Popüler yayınlar

CSS content Özelliği

CSS justify-content Özelliği

CSS top Özelliği

HTML strong Etiketi

Javascript ile neler yapılabilir

Kriptopara nasıl alınır ve nereden alınır?

Javascript Oyun Yapma Dersleri HTML5+CSS3

Ücretsiz Bitcoin Kazan Pasif Gelir Elde Et İnternetten Para Kazan

HTML5 Canvas Oyun Yapımı Dersleri

CSS align-self özelliği