Örnek
Esnek öğeleri yerleştirin <div> çizgiler arasındaki boşluk elemanı:
// Code for Safari 7.0+
document.getElementById("main").style.WebkitAlignContent = "space-between";
// Standard syntax
document.getElementById("main").style.alignContent
= "space-between"; Kendin dene " Tanımı ve Kullanımı
Ürün çapraz ekseni üzerinde tüm alanı kullanmayın zaman alignContent özelliği esnek kabın ürün hizalar (vertically) .
İpucu: Ana ekseni üzerindeki öğeleri hizalamak için justifyContent özelliğini kullanın (horizontally) .
Not: Herhangi bir etkiye sahip bu özellik için öğelerin birden çok satır olmalı.
Tarayıcı Desteği
Tablodaki rakamlar tam özelliğini destekleyen ilk tarayıcı sürümü belirtin.
Webkit ardından Numaraları önek ile çalıştı ilk sürümü belirtin.
| özellik | |||||
|---|---|---|---|---|---|
| alignContent | 21,0 | 11.0 | 28,0 | 7.0 Webkit | 12.1 |
Not: Safari alternatif, WebkitAlignContent özelliğini desteklemez.
Sözdizimi
alignContent özelliğini Dönüş:
object .style.alignContentalignContent özelliğini ayarlayın:
object .style.alignContent="stretch|center|flex-start|flex-end|space-between|space-around|initial|inherit"
Mülkiyet Değerler
| değer | Açıklama |
|---|---|
| stretch | Varsayılan değer. Öğeler kabı sığacak şekilde uzatılır |
| center | Ürünler, kabın merkezinde konumlandırılmış |
| flex-start | Öğeler kabın başında konumlandırılmış |
| flex-end | Ürünler, kabın ucunda konumlandırılmış |
| space-between | Öğeler çizgi arasındaki boşluk konumlandırılır |
| space-around | Ürünler arasında, daha önce boşluk yerleştirilebilir ve hatlar sonra |
| initial | varsayılan değerine bu özelliği ayarlar. İlk hakkında okuyun |
| inherit | üst öğesinden bu özelliği devralır. Yaklaşık miras oku |
Teknik detaylar
| Varsayılan değer: | germek |
|---|---|
| Geri dönüş değeri: | bir elemanın hizalama içerik özelliğini temsil eden bir String, |
| CSS Sürüm | CSS3 |
İlgili Sayfalar
CSS referansı: align-content property
HTML DOM STİL Referans: alignItems property
HTML DOM STİL Referans: alignSelf property
HTML DOM STİL Referans: justifyContent property
<Stil Nesne