Atrybut align-items CSS

Definicja i użycie

align-items Atrybutu alignItems do określenia domyślnej metody wyśrodkowania elementów w kontenerze elastycznym.

Wskazówka:Użyj atrybutu align-self Atrybuty do nadpisania tego atrybutu alignItems.

Zobacz również:

Podręcznik CSS:CSS Grid

Podręcznik CSS:CSS Flexbox

Podręcznik CSS:Atrybut align-content

Podręcznik CSS:Atrybut align-self

Podręcznik CSS:Atrybut justify-content

Podręcznik CSS:Atrybut justify-items

Podręcznik CSS:Atrybut justify-self

Podręcznik HTML DOM:Atrybut alignItems

Przykład

Wyśrodkuj wszystkie elementy w elemencie <div>弹性容器:

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

Spróbuj sam

Gramatyka CSS

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

Wartość atrybutu

Wartość Opis
stretch Domyślnie. Element jest rozciągnięty, aby pasował do kontenera.
center Element znajduje się w środku kontenera.
flex-start Element znajduje się na początku kontenera.
flex-end Element znajduje się na końcu kontenera.
baseline Element znajduje się na bazowej linii kontenera.
initial Ustaw ten atrybut na jego wartość domyślną. Zobacz: initial.
inherit Zarówno ten atrybut, jak i jego wartość są dziedziczone od elementu nadrzędnego. Zobacz: inherit.

Szczegóły techniczne

Domyślna wartość: stretch
Inheredowanie: Nie
Tworzenie animacji: Nieobsługiwane. Zobacz:Atrybuty animacji.
Wersja: CSS3
Gramatyka JavaScript: object.style.alignItems="center"

Obsługa przeglądarek

Liczby w tabeli wskazują na pierwszą wersję przeglądarki, która w pełni obsługuje tę właściwość.

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