• 회원가입
  • 로그인
  • 구글아이디로 로그인

[text] CSS - unicode-bidi 속성 - 텍스트글자방향 (= unicode-bidi속성 = 유니코드비디속성)

목차
  1. unicode-bidi 예제 - 텍스트 글자 방향
  2. unicode-bidi 정의
  3. unicode-bidi 구문

 

unicode-bidi 예제 - 텍스트 글자 방향

 

<style>

div.a {

  direction: rtl;

}

div.b {

  unicode-bidi: bidi-override;

}

div.c {

  direction: ltr;

  unicode-bidi: bidi-override;

}

div.d {

  direction: rtl;

  unicode-bidi: bidi-override;

}

</style>


<div class="a">홈짱닷컴 Homzzang.com</div>

<div class="b">홈짱닷컴 Homzzang.com</div>

<div class="c">홈짱닷컴 Homzzang.com</div>

<div class="d">홈짱닷컴 Homzzang.com</div>

 

결과보기


unicode-bidi 정의

 
동일한 문서에서 여러 언어를 지원하도록 텍스트 방향 재정의.
(direction 속성과 함께 사용.)

 


 
1.
  • 기본값: normal
  • 상속여부: O
  • 애니효과: X
  • CSS버전: CSS2
  • JS구문: object.style.unicodeBidi="bidi-override"
 
2.
모든 브라우저 지원.
 
 

unicode-bidi 구문

 

selector {unicode-bidi: normal|embed|bidi-override|initial|inherit;}

 


[속성값]
 
normal
기본 글자 방향. (기본값) 
 
embed
무슨 효과인지 잘 모르겠음.
 
bidi-override 
글자 한자한자를 오른쪽에서 왼쪽으로 출력. (block 요소에 사용.)
※ direction:rtl; 속성과 함께 사용해야 효과 나타남.
 
isolate
요소가 형제요소와 분리됨. 
 
isolate-override
생긴지 얼마 안 되서 잘 모르겠음. ㅡㅡ;
 
initial
이 속성의 기본값으로 설정. 
 
inherit
부모요소의 속성값 상속.


 


분류 제목
text CSS - text-emphasis 속성 - 텍스트 강조마크의 '모먕/색깔' 일괄 지정 (= 텍스트 글자 위…
text CSS - text-justify 속성 - 텍스트 좌우균분정렬 세부설정 (= text-justify속성 = …
text CSS - text-overflow 속성 ★ - 영역 이탈 글자 처리 (= text-overflow속성 = …
text CSS - word-break 속성 ★ - 한중일 외의 언어 (단어기준/글자기준) 줄바꿈규칙 지정 (= 줄…
text CSS - word-wrap 속성 ★ - 단어줄바꿈 위해 긴단어쪼개기 (= 긴단어깨기 = 긴단어나누기 = w…
font CSS - @font-face 구문 - 다운받은 웹폰트적용 (= @font-face쿼리 = 다운글꼴적용 = …
transform CSS - transform 속성 ★ - 요소 (회전/비틀기/크기확대) 변환 + 마우스 허버 시 줌효과 (=…
transform CSS - transform-origin 속성 - 변형요소 위치 변경. ( = transform-origin…
transform CSS - transform-style 속성 - 중첩요소를 3D공간에서 표시 방법 (= transform-s…
transform CSS - perspective 속성 - 3D요소의 원근 조망. (= perspective속성 = 퍼스펙티브…
transform CSS - perspective-origin 속성 - 3D요소 바라보는 위치 (= perspective-or…
transform CSS - backface-visibility 속성 - 3D요소 뒷면 노출 여부. (= backface-vi…
transition CSS - transition 속성 ★★★ - 지정시간 동안 천천히 변화 (= transition속성 = 트…
transition CSS - transition-delay 속성 - 트랜지션 시작 대기 시간 (= transition-dela…
transition CSS - transition-duration 속성 ★ - 트랜지션 완료에 걸리는 시간 (= transiti…
transition CSS - transition-property 속성 - 트랜지션 효과 적용할 속성명 지정 (= transit…
transition CSS - transition-timing-function 속성 - 트랜지션 속도변경곡선 (= transit…
animation CSS - @keyframes 구문 - 애니메이션 코드 사용 선언 (= 애니사용 = @keyframes속성 …
animation CSS - animation 속성 ★ - 애니메이션 단축속성 (= animation속성 = 애니메이션속성, …
animation CSS - animation-delay 속성 - 애니지연시간 (= 작동지연시간 = 작동대기시간 = 작동준비시…
8/25
목록
찾아주셔서 감사합니다. Since 2012