Stil justifyContent Özellik
Örnek
Esnek <div> öğesinin öğeleri arasında biraz boşluk bırakın:
document.getElementById("main").style.justifyContent = "space-between";
Tanım ve Kullanım
justifyContent özelliği, öğeler ana eksende (yatay olarak) tüm kullanılabilir alanı kullanmadığında esnek kapsayıcının öğelerini hizalar.
İpucu: Öğeleri çapraz eksende (dikey olarak) hizalamak için alignContent özelliğini kullanın.
Tarayıcı Desteği
Property | |||||
---|---|---|---|---|---|
justifyContent | Yes | 12.0 | Yes | 9.0 | Yes |
Sözdizimi
justifyContent özelliğini döndürün:
object.style.justifyContent
justifyContent özelliğini ayarlayın:
object.style.justifyContent = "flex-start|flex-end|center|space-between|space-around|initial|inherit"
Mülk değerleri
Value | Description |
---|---|
flex-start | Default value. Items are positioned at the beginning of the container |
flex-end | Items are positioned at the end of the container |
center | Items are positioned at the center of the container |
space-between | Items are positioned with space between the lines |
space-around | Items are positioned with space before, between, and after the lines |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Teknik detaylar
Varsayılan değer: | esnek başlangıç |
---|---|
Geri dönüş değeri: | Bir öğenin gerekçeli içerik özelliğini temsil eden bir Dize |
CSS Sürümü | CSS3 |
İlgili Sayfalar
CSS referansı: haklı içerik özelliği
HTML DOM STYLE Referansı: alignContent özelliği
HTML DOM STYLE Referansı: alignItems özelliği
HTML DOM STYLE Referansı: alignSelf özelliği
❮ Stil Nesnesi