CSS align-items 속성
예시
유연한 <div> 요소의 모든 항목에 대한 정렬을 중앙에 배치합니다.
div
{
display: flex;
align-items: center;
}
정의 및 사용
align-items
속성은 유연한 컨테이너 내부 항목의 기본 정렬을 지정합니다 .
팁: 각 항목의 align-self 속성을 사용하여 속성을 재정의합니다 align-items
.
브라우저 지원
표의 숫자는 속성을 완전히 지원하는 첫 번째 브라우저 버전을 지정합니다.
-webkit- 뒤에 오는 숫자는 접두사와 함께 작동한 첫 번째 버전을 지정합니다.
Property | |||||
---|---|---|---|---|---|
align-items | 21.0 | 11.0 | 20.0 | 9.0 7.0 -webkit- |
12.1 |
CSS 구문
align-items: stretch|center|flex-start|flex-end|baseline|initial|inherit;
속성 값
Value | Description | Play it |
---|---|---|
stretch | Default. Items are stretched to fit the container | |
center | Items are positioned at the center of the container | |
flex-start | Items are positioned at the beginning of the container | |
flex-end | Items are positioned at the end of the container | |
baseline | Items are positioned at the baseline of the container | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
관련 페이지
CSS 참조: align-content 속성
CSS 참조: align-self 속성
HTML DOM 참조: alignItems 속성