Makini ya CSS align-items Property

Makadaro na matumizi

align-items Tabia hii inatumika kusababisha uangalifu wa kuzingatia wa kwa kila maelezo katika eneo la kina la container.

Mafanikio:Tumia tabia ya kila maelezo align-self Tabia inayotumiwa kuingiliana na tabia ya alignItems.

Tazama pia:

Mafunzo ya KiCSS:CSS Grid

Mafunzo ya KiCSS:Flexbox wa CSS

Kitabu cha kielektroniki cha KiCSS:Tabia ya alignContent

Kitabu cha kielektroniki cha KiCSS:Tabia ya alignSelf

Kitabu cha kielektroniki cha KiCSS:Tabia ya justifyContent

Kitabu cha kielektroniki cha KiCSS:Tabia ya justifyItems

Kitabu cha kielektroniki cha KiCSS:Tabia ya justifySelf

Kitabu cha kielektroniki cha HTML DOM:Tabia ya alignItems

Mifano

Kumaliza kwa kuzingatia kwa kila maelezo ya elementi ya <div> ya kina:

div {
  display: flex;
  align-items: center;
}

Tafakari kwa mwenyewe

Inayotumika kwa KiCSS

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

Chaguo cha tabia

Chaguo Maelezo
stretch Chaguo cha kuzingatia. Inaendelea kufikiria eneo hili.
center Inaendelea katika kati cha eneo hili.
flex-start Inaendelea katika kwanza cha eneo hili.
flex-end Inaendelea katika mfunzo wa eneo hili.
baseline Inaendelea katika ukingo wa kuzingatia wa eneo hili.
initial Kumaliza tabia hii kwa chaguo cha kuzingatia. Tazama: initial.
inherit Kumwemoa katika elementi yake ya mababu kwa sababu ya kufungua tabia hii. Tazama: inherit.

Vifaa vya mbinu

Chaguo cha kuzingatia: stretch
Kumuwemoa: Haiweza
Tengeneza mawingu: Haiwakilishwa. Tazama:Mafuta ya hali ya mawingu.
Sukuu: CSS3
Inayotumika kwa Kijavascript: object.style.alignItems="center"

Muungano wa browser

Mafuatili ya mifano ya browser zimekabilisha kwa sababu ya kufungua tabia hii.

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