In the Multi-language page, the students who have contacted Aripo and Hebrew must understand the importance of writing direction, including the order of writing before our movement is also from right to left. The Unicode-bidi and direction properties in CSS determine the direction in which HTML or XML text is rendered, and two properties can be used to change the order of writing
Direction
Direction attribute has three values
Inherit using the parent element's settings
Ltr default value, left to right
RTL right-to-left
Our default writing order is left-to-right, not special settings, but for Arabic is right-to-left, this time you need to set the direction property to correctly show the
Prevent browser rewriting text-align Let's do the default settings
<p style= "direction:rtl;text-align:initial;" > طهيسيستآختتهاتيسوريتتآنفرومريغتتولآفتتهاتيسوسآد </p>
Corresponding also has an HTML attribute dir can be set
<p dir= "RTL" dtyle= "text-align:initial;" > طهيسيستآختتهاتيسوريتتآنفرومريغتتولآفتتهاتيسوسآد </p>
Direction properties The default writing order is the same as the text-align, the latter is the direction, the writing order is unchanged
<p style= "direction:rtl;text-align:initial;" >1 2 3 4 5 6. </p><p style= "text-align:right;" >1 2 3 4 5 6. </p>
Unicode-bidi
Seems to have direction can cope with the writing direction of the problem, what is Unicode-bidi to do?
Browsers usually determine the direction of writing based on the lang attribute or special font-family, but if you include a text in two directions in a sentence, you need to use the Unicode-bidi attribute.
Unicode-bidi has three widely supported values
What is the order in which the normal is originally used?
Embed acts on the inline element, the value of the direction property specifies the embedding layer, and an implicit reordering within the object
Bidi-override is reordered strictly by the value of the direction property. Ignore implicit bidirectional arithmetic rules
To tell the truth, I can't read the explanation, see an example.
<p style= "direction:rtl;text-align:initial;" >this is a test</p><p style= "direction:rtl;unicode-bidi:bidi-override;text-align:initial;" > This is a test</p><p style= "direction:rtl;unicode-bidi:bidi-override;text-align:initial;" > This <span style= "unicode-bidi:embed;" >is a</span> test</p>
The first line is simple right-aligned, the text will not be written backwards (Arabic will, explained later)
The second row of two properties combined, not only right to the left to write and really from right to left to write, this is a serious Arabic wording
The effect of the third line is wonderful in that the second line is based on the style unicode-bidi:embed; it's not written backwards, it's written in the normal writing order.
Why the Arabic only set direction can be displayed correctly, but the English word only the right alignment effect, not from right to left to write, only set the Unicode-bidi:bidi-override;
This is related to the specific language, for the Arabic and Hebrew language automatically, a single number, the letter browser can not judge the language with RTL default settings, English, etc. or use the default left-to-right way, can only be rewritten with Unicode-bidi
Specifies the language for the Arabic page to be automatically written in the order RTL when declaring
Direction is to express the direction of writing, and Writing-mode are different functions, each has a length, can be used in combination.