bdi element - by. UXKM

bdi element 설명

이 요소는 포함된 텍스트의 방향을 알 수 없을 떄 내부의 텍스트의 방향이 고정되도록 하는데에 유용합니다.
<bdi> 요소의 BDI는 Bi-Directional Isolation을 의미하며, 주위의 텍스트들과는 다른 방향으로 출력되는 텍스트 영역을 정의할 때 사용합니다.
한글이나 영어와 같이 대부분의 언어는 왼쪽부터 시작해서 오른쪽 방향으로(left-to-right, LTR) 텍스트를 나열합니다.
하지만 아랍어(Arabic)와 같은 일부 언어에서는 오른쪽부터 시작하여 왼쪽 방향으로(right-to-left, RTL) 텍스트를 나열합니다.
브라우저는 이러한 텍스트의 방향성을 유니코드 양방향 알고리즘(Unicode Bidirectional Algorithm)이라는 알고리즘을 사용하여 처리하게 되는데, 바로 이 때 특정 텍스트 영역에 <bdi> 요소를 사용하게 되면 양방향 알고리즘은 해당 텍스트의 방향성을 그 주위에 위치한 다른 텍스트들과는 별도로 처리하게 됩니다.
따라서 <bdi> 요소는 텍스트의 방향성을 미리 알 수 없는 사용자에 의해 생성되는 콘텐츠 등을 문서에 포함시킬 때 유용하게 사용됩니다.

<bdi> 요소는 HTML5에서 새롭게 추가된 요소입니다.
Internet Explorer, Edge, Safari, Opera : No support(지원하지 않음)