Atribut align-self CSS

Definisi dan penggunaan

align-self Atribut menentukan cara pengaturan penempatan item yang dipilih di dalam kontainer elasti.

Perhatian:Atribut align-self akan menimpa atribut kontainer elasti align-items Atribut.

Lihat juga:

Panduan CSS:CSS Grid

Panduan CSS:Flexbox CSS

Panduan CSS:Atribut alignContent

Panduan CSS:Atribut alignItems

Panduan CSS:Atribut justifySelf

Panduan HTML DOM:Atribut alignSelf

Contoh

Menaruhkan salah satu item di dalam elemen elasti untuk diatur di tengah:

#myBlueDiv {
  align-self: center;
}

Coba sendiri

Sintaksis CSS

align-self: auto|stretch|center|flex-start|flex-end|baseline|initial|inherit;

Nilai atribut

Nilai Deskripsi
auto Baku. Elemen mewarisi atribut align-items dari kontainer elastiannya, jika tidak ada kontainer, maka "stretch".
stretch Elemen disرتakan untuk memadai kontainer.
center Elemen berada di tengah kontainer.
flex-start Elemen berada di awal kontainer.
flex-end Elemen berada di ujung kontainer.
baseline Elemen ditempatkan di garis dasar kontainer.
initial Tetapkan atribut ini ke nilai baku. Lihat: initial.
inherit Mengambil atribut ini dari elemen induknya. Lihat: inherit.

Detil teknis

Nilai baku: auto
Warisan: Tidak
Pembuatan animasi: Tidak didukung. Lihat:Atribut yang berhubungan dengan animasi.
Versi: CSS3
Sintaksis JavaScript: object.style.alignSelf="center"

Dukungan browser

Angka di dalam tabel menunjukkan versi browser pertama yang mendukung sifat ini.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
57.0 16.0 52.0 10.1 44.0