HTML DOM Style unicodeBidi Property

The HTML DOM style unicodeBidi property returns and modify whether the text should be overridden to support multiple languages in the same HTML document along with direction property.

Syntax

Following is the syntax −

Returning unicodeBidi

object.style.unicodeBidi

Modifying unicodeBidi

object.style.unicodeBidi = “value”

Values

Here, value can be −

Value	Explanation
inherit	It inherits this property value from its parent element.
initial	It set this property value to its default value.
normal	It sets no additional level of embedding.
embed	It sets an additional level of embedding.
bidi-override	It sets an additional level of embedding and reorder it depending on the direction property.

Example

Let us see an example of HTML DOM style unicodeBidi property −

<!DOCTYPE html>
<html>
<head>
<style>
   body {
      color: #000;
      background: lightblue;
      height: 100vh;
      text-align: center;
   }
   .btn {
      background: #db133a;
      border: none;
      height: 2rem;
      border-radius: 2px;
      width: 40%;
      display: block;
      color: #fff;
      outline: none;
      cursor: pointer;
      margin: 1rem auto;
   }
</style>
</head>
<body>
<h1>DOM Style transformStyle Property Example</h1>
<p style="direction:ltr">This is a paragraph element with some dummy text.</p>
<button onclick="add()" class="btn">Set unicodeBidi</button>
<script>
   function add() {
      document.querySelector('p').style.direction = "rtl";
      document.querySelector('p').style.unicodeBidi = "bidi-override";
   }
</script>
</body>
</html>

Output

This will produce the following output −

HTML DOM Style unicodeBidi Property

Click on “Set unicodeBidi” button to set unicodeBidi CSS property on paragraph element.

HTML DOM Style unicodeBidi Property