CSS grid-column-end özelliği

Tanım ve Kullanım

grid-column-end özelliği, projenin kaç sütun geçeceğini belirler veya projenin hangi sütun çizgisinde (column-line) sona ereceğini belirler.

Sayfa sonundaki örnekleri bakınız.

Ayrıca Bakınız:

CSS Eğitimi:CSS Ağırlandırma

Örnek

Örnek 1

"item1" adlı öğenin üç sütun geçmesini sağlayın:

.item1 {
  grid-column-end: span 3;
}

Kişisel Deneyim

Örnek 2

Geçilecek sütun sayısını sütun çizgisi değerleri ile değiştirebilirsiniz:

.item1 {
  grid-column-end: 3;
}

Kişisel Deneyim

CSS Dilbilgisi

grid-column-end: auto|span n|column-line;

Özellik Değeri

Değer Tanım
auto Öntanımlı Değer. Proje bir sütun geçer.
span n Projenin yatay olarak kaç sütun geçeceğini belirten.
column-line Nerede durdurulacağını belirten sütun.

Teknik Ayrıntılar

Öntanımlı Değer: auto
Devralma: Hayır
Animasyon Yapımı: Desteği Var. Aşağıdan bakınız:Animasyon İle İlgili Özellikler.
Sürüm: CSS Grid Layout Modülü 1
JavaScript Dilbilgisi: object.style.gridColumnEnd="5"

Tarayıcı Desteği

Tablo içindeki rakamlar, bu özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtmektedir.

Chrome IE / Edge Firefox Safari Opera
57 16 52 10 44