Style alignSelf 속성

정의와 사용법

alignSelf 속성은 유연한 컨테이너 내에서 선택된 항목의 정렬 방식을 정의합니다.

주의사항:alignSelf 속성은 유연한 컨테이너의 alignItems 속성.

예제

컨테이너에 맞춰 적절한 정렬 방식을 설정하여 퍼즐 요소 내의 한 요소에 적용합니다:

document.getElementById("myBlueDiv").style.alignSelf = "stretch";

직접 시도해 보세요

문법

alignSelf 속성 반환:

object.style.alignSelf

alignSelf 속성 설정:

object.style.alignSelf = "auto|stretch|center|flex-start|flex-end|baseline|initial|inherit"

속성 값

값 설명
auto 기본. 요소는 부모 컨테이너의 align-items 속성을 상속합니다. 부모 컨테이너가 없으면 "stretch"입니다.
stretch 요소가 컨테이너에 맞춰 확장됩니다.
center 요소가 컨테이너의 중앙에 위치합니다.
flex-start 요소가 컨테이너의 시작에 위치합니다.
flex-end 요소가 컨테이너의 끝에 위치합니다.
baseline 요소가 컨테이너의 기본선에 위치합니다.
initial 이 속성을 기본 값으로 설정합니다. 참조: initial.
inherit 이 속성을 부모 요소에서 상속합니다. 참조: inherit.

기술 세부 사항

기본 값: auto
반환 값: 문자열로, 요소의 align-self 속성.
CSS 버전: CSS3

브라우저 지원

alignItems CSS3 (1999) 기능입니다.

모든 브라우저는 완전히 지원합니다:

크롬 에지 파이어폭스 사파리 오페라 IE
크롬 에지 파이어폭스 사파리 오페라 IE
지원 지원 지원 지원 지원 11

관련 페이지

CSS 참조 매뉴얼:align-self 속성

HTML DOM STYLE 참조 문서:alignContent 속성

HTML DOM STYLE 참조 문서:alignItems 속성