CSS align-self ominaisuus

Määritelmä ja käyttö

align-self ominaisuus määrittää joustavien konttien sisällä valittujen kohteiden tasauksen.

Huomaa:alignSelf ominaisuus korvaa joustavien konttien align-items ominaisuudet.

Katso myös:

CSS opetus:CSS Grid

CSS opetus:CSS Flexbox

CSS viittausopas:alignContent ominaisuus

CSS viittausopas:alignItems ominaisuus

CSS viittausopas:justifySelf ominaisuus

HTML DOM viittausopas:alignSelf ominaisuus

Esimerkki

Täytä dynaamisen elementin yksi kohta keskelle:

#myBlueDiv {
  align-self: center;
}

Kokeile itse

CSS syntaksi

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

Ominaisuuden arvo

Arvo Kuvaus
auto Oletus. Elementti perii vanhempiensa align-items ominaisuuden, ellei ole isäntäelementtiä, niin "stretch".
stretch Elementti venytetään sopimaan konttiin.
center Elementti sijaitsee kontin keskellä.
flex-start Elementti sijaitsee kontin alussa.
flex-end Elementti sijaitsee kontin lopussa.
perusviiva Elementti sijoitetaan konttin perusviivaan.
initial Aseta tämä ominaisuus sen oletusarvon arvoon. Katso: initial.
inherit Perii tämän ominaisuuden vanhemmalta elementiltä. Katso: inherit.

Tekninen tarkistus

Oletusarvo: auto
Perintä: Ei
Animaation tekeminen: Ei tuettu. Katso:Animaatiot.
Versio: CSS3
JavaScript syntaksi: object.style.alignSelf="center"

Selaimen tuki

Taulukossa olevat numerot osoittavat ensimmäisen selaimen version, joka tukee tätä ominaisuutta täysin.

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