betacode

Руководство атрибутам HTML dir

View more Tutorials:

Сайт бесплатного изучения языков:
Следуйте за нами на нашей фан-странице, чтобы получать уведомления каждый раз, когда появляются новые статьи. Facebook

1- HTML Direction

Язык HTML был создан, чтобы гарантировать то, что он может создать подходящие website для разных культур. Арабский - один из четырех самых распространенных языков в мире. Содержание в книгах и website Арабов написано справа налево (Right To Left - RTL), это может быть довольно странно для других стран.
Например ниже является государственный website Ирака (IRAQ​​​​​​​).
Чтобы содержание элемента отображалось справа налево (RTL), мы используем атрибут (attribute) dir='rlt':
dir-example.html

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Dir Attribute</title>
      <meta charset="UTF-8"/>
      <style>
          div {
            border: 1px solid green;
            padding: 5px;
            margin: 10px 0;
          }
      </style>
   </head>
   <body>
       <h1>HTML Dir Attribute</h1>
       <hr/><br/>
       <div>
           <h3>LTR (Left-to-Right) Direction! (Default)</h3>
           I am a Text.
        </div>
       <div dir = "rtl">
          <h3>RTL (Right-to-Left) Direction!</h3>
          I am a Text.
       </div>
   </body>
</html>
Почти все браузеры поддерживают атрибут (attribute) dir, за исключением Internet Explorer и Edge.

<element dir = "ltr|rtl|auto">..</element>
ЗначениеОписание
ltrИспользуется для языков, которые пишутся слева направо, например английский.
rltИспользуется для языков, которые пишутся справа налево, например Арабский.
autoБраузер основывается на юзерагенте (user agent) для решения. Он использует базовый алгоритм чтобы парсировать (parse) содержание внутри элемента до тех пор пока не найдет символ с сильным направлением (strong directionality), потом применяет данное направление ко всему элементу. 
Примечание: HTML5 поддерживает атрибут (attribute) dir для всех элементов, при этом HTML4 поддерживает данный атрибут для всех элементов кроме <base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param>, <script>.

View more Tutorials: