Summary -

In this topic, we described about the <bdo> tag along with detailed example.

Bi-Directional override element is used to override Bi-Directional element by the author. Bi-Directional override element uses <bdo> tag. It allows authors to override the text direction.

The text should be specified in between the opening and closing tags <bdo dir=""></bdo> to apply Bi-directional Isolation along with override direction. <bdo> element is nested element. <bdo> element is used to override the current text direction.

By default, the text direction is left to right and if the text direction needs to be different then it should specify explicitly. To override bi-directional text, global attribute "dir" is mandatory. The values for "dir" attribute are "ltr"(left-to-right) or "rtl"(right-to-left).

Note! The dir global attribute must be set either to ltr or rtl.

Syntax -

<bdo>.. text here.. </bdo>

Example -

<!DOCTYPE html> 
<html>
	<head>
		<title> Bi-Directional override element example.. </title>
	</head>
	<body>
		<p><b>Normal Text: </b>The text direction is from left to right 
		by default</p>
		<p><b>Right to Left Text: </b><bdo dir="rtl">The text direction 
		is from right to left</bdo></p>
	</body>
</html>

Output -

Normal Text: The text direction is from left to right by default

Right to Left Text: The text direction is from right to left