CSS3 상자의 방향 속성
예
지정된 div 요소의 자식 요소는 가로 방향으로 배열 :
사업부
{
폭 : 350px;
높이 : 100 픽셀;
국경 : 1 픽셀 검은 색;
/ * 파이어 폭스 * /
디스플레이 : -moz-상자;
-moz-상자의 방향 : 수평;
/ * 사파리, 오페라, 크롬 및 * /
디스플레이 : -webkit-상자;
-webkit-상자의 방향 : 수평;
/ * W3C * /
디스플레이 : 상자;
상자의 방향을 수평;
}
{
폭 : 350px;
높이 : 100 픽셀;
국경 : 1 픽셀 검은 색;
/ * 파이어 폭스 * /
디스플레이 : -moz-상자;
-moz-상자의 방향 : 수평;
/ * 사파리, 오페라, 크롬 및 * /
디스플레이 : -webkit-상자;
-webkit-상자의 방향 : 수평;
/ * W3C * /
디스플레이 : 상자;
상자의 방향을 수평;
}
»시도
브라우저 지원
현재, 모든 주요 브라우저는 상자의 방향 속성을 지원하지 않습니다.
MOZ 박스의 방향 지원 - 개인 재산으로 파이어 폭스.
개인 재산 -webkit-상자의 방향 지원을 통해 사파리, 오페라, 그리고 크롬.
정의 및 지침을 속성
상자의 방향 속성은 상자가 가로 또는 세로 자식 요소할지 여부를 지정합니다.
팁 : 왼쪽에서 오른쪽으로 수평 방향의 하위 요소에 상자가표시됩니다, 상자가 위에서 아래로 수직으로 표시됩니다. 그러나 상자 방향 방향이 될 수 상자 순서-그룹 이 순서를 변경하는 속성입니다.
기본값 : | 인라인 축 |
---|---|
상속 : | 아니 |
버전 : | CSS3 |
자바 스크립트 구문 : | 개체 .style.boxOrient = "수직" |
문법
상자의 방향 : 수평 | 수직 | 인라인 축 | 블록 축 | 상속;
값 | 설명 |
---|---|
수평 | 왼쪽에서 오른쪽으로 지정된 서브 엘리먼트는 가로 일렬로 배치되어있다 |
수직의 | 정상에서 하위 요소의 수직 배열의 맨 아래로 |
인라인 축 | 축을 따라 인라인 자식 요소 (풍경에 매핑) |
블록 축 | 축을 따라 서브 블록 요소 (수직으로 매핑) |
상속 | 값 상자의 방향 속성은 부모 요소로부터 상속되어야한다 |