English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

CSS 참조 매뉴얼

CSS @규칙(RULES)

CSS 속성 전체 목록

CSS 방향 속성 사용 방법 및 예제

direction属性指定:

아래 표는 이 속성의 사용 설명과 버전 기록, 그리고 이 속성이 JavaScript 스크립트에서 사용하는 문법을 설명합니다.

기본 값:ltr
적용:모든 요소
상속:
애니메이션 가능:아니요.참조: 애니메이션 속성
버전:CSS 2、3
JavaScript 문법:object.style.direction="rtl"

주의:HTML에서의 dir 속성과 달리, 테이블 요소에 지정된 direction CSS 속성은 테이블 셀에 의해 상속되지 않습니다. 왜냐하면 CSS 상속은 문서 트리를 따르며, 행은 문서 트리에서 셀의 부모이며, 열이 아닙니다.

방향 사용 문법

이 속성의 문법은 다음과 같습니다:

direction: ltr | rtl | initial | inherit

아래 예제는 direction 속성을 사용하는 방법을 보여줍니다.

  p {
   direction: rtl;
   unicode-bidi: bidi-override;
  }
테스트를 보려면‹/›

주의:direction 속성이 인라인 요소 내에서 재정렬에 영향을 미치기 위해 이unicode-bidi속성 값은 embed 또는 override여야 합니다.

속성 값

아래 표는 이 속성의 값을 설명합니다.

설명
ltr왼쪽에서 오른쪽으로의 방향을 설정합니다. 기본 값입니다.
rtl오른쪽에서 왼쪽으로의 방향을 설정합니다.
initial이 속성을 기본 값으로 설정합니다.
inherit지정된 경우, 관련 요소는 부모 요소의 direction 속성 값을 사용합니다.

브라우저 호환성

direction 속성의 브라우저 호환성을 확인하십시오. 아래 표의 숫자는 이 속성을 지원하는 브라우저의 최소 버전 번호를 나타냅니다. 모든 주요 브라우저는 이 속성을 지원합니다.

  • 파이어폭스 1+

  • Google 크롬2+

  • 인터넷 익스플로러 5.5위에

  • Apple 사파리 1+

  • 오페라 9.2+

더 읽어보기

다음 튜토리얼을 참조하십시오:CSS 텍스트

관련 속성: unicode-bidi