Template:Bdi/doc
Usage
{{bdi}} is a front-end for the HTML element <bdi>
, which is used to delimit a span of text that has a text direction which is either unknown, or opposite to that of the main text. It enables the use of, e.g. Arabic script as inline text in an English article (and vice versa).
Mixed text directions often causes text flow problems. Words will become jumbled at line-breaks, and punctuation marks may be displayed on the wrong side of the string, since they get interpreted as part of the inserted text.
Parameters
There is only 1 parameter, which is unnamed and required.
Syntax
The template's syntax is
-
{{bdi|custom text}}
Required parameter
1
- Custom text
The text that should be enclosed in <bdi>
tags.
- Usage
-
{{bdi|1}}
Examples
Correct use
Case | What you type | What you see |
---|---|---|
Basic use | موزيلا فيرفكس}} | موزيلا فيرفكس |
In inline text | موزيلا فيرفكس}}, is a popular web-browser. | Mozilla Firefox, in Arabic موزيلا فيرفكس, is a popular web-browser. |
Comparison between <bdi> and <bdo>
The <bdi>
tag derives the direction of the text it encloses from the text itself. You don't include any directional information. The <bdo>
tag, however, forces the text it encloses to flow in a certain direction, specified through the attribute dir=
.
Because of that, {{bdo}} shouldn't be used in cases where the direction of the inserted text is unknown, but it is a good alternative if {{bdi}} should fail to derive the direction.
<bdi>
The <bdi>
tag is used in the same way, regardless of the text direction of the inserted string.
Case | What you type | What you see | Comments |
---|---|---|---|
<bdi> adapts to the text direction of the enclosed string |
من اليمين إلى اليسار}} | من اليمين إلى اليسار | Works for both rtl and ltr input |
From left to right}} | From left to right |
<bdo>
The <bdo>
tag may make the text virtually unreadable, if used incorrectly. Mind the dir=
.
- Correct
Case | What you type | What you see | Comments |
---|---|---|---|
<bdo> has a preset directional output |
من اليمين إلى اليسار}} | من اليمين إلى اليسار | The default direction is rtl |
dir=ltr|From left to right}} | From left to right | ltr must be explicitly specified |
- Incorrect
Case | What you type | What you see | Comments |
---|---|---|---|
Wrong value for the dir attribute |
dir=ltr|من اليمين إلى اليسار}} | من اليمين إلى اليسار | The text is displayed backwards (<bdo> forces the direction)
|
From left to right}} | From left to right |
See also
- {{bdo}}: inserts
<bdo>
tags, forcing inline changes in text direction.
- {{abbr}}: inserts
<abbr>
tags to include a tooltip explanation of an abbreviation. - {{code}}: inserts
<code>
tags. - {{mark}}: inserts
<mark>
tags, highlighting the enclosed text. - {{samp}}: inserts
<samp>
tags. - {{var}}: inserts
<var>
tags. - {{varserif}}: inserts
<var>
tags with serif font styling.