Propriedade unicode-bidi
Última atualização: 2026-09-13
unicode-bidi Propriedade unicode-bidi
A propriedade unicode-bidi do CSS controla o Algoritmo Bidirecional Unicode para o texto, lidando com casos em que textos de direções diferentes (como inglês e árabe) são misturados. Ela pode alterar o nível de incorporação do texto, substituir a direção ou separar um elemento do contexto de direção de seu pai, sendo uma propriedade essencial para direções de texto complexas em sites internacionalizados.
| Categoria | |
|---|---|
| Valor Inicial | normal |
| Herdado | Não |
| Aplica-se A | |
| Tipo de Animação | |
| Versão CSS | CSS2 |
| Status | Padrão |
📝 Sintaxe
unicode-bidi: normal | embed | isolate | bidi-override | isolate-override | plaintext;
⚙️ Valores
| Valor | Tipo | Descrição |
|---|---|---|
normal | embed | isolate | bidi-override | isolate-override | plaintext | Palavra-chave | Modos de tratamento de texto bidirecional |
▶ Exemplo
Edite o código abaixo e veja o resultado ao vivo no playground:
🌐 Suporte dos Navegadores
| Navegador | |||||
|---|---|---|---|---|---|
| unicode-bidi | ✓ v10 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Suportado em todos os principais navegadores | |||||
Dica: isolate é o valor mais usado: impede que a direção do elemento afete o texto ao redor e vice-versa, o que é ideal para incorporar conteúdo de terceiros.
Importante: bidi-override inverte à força a direção do texto e pode bagunçar a ordem de exibição; a menos que seja realmente necessário, prefira isolate.
❓ Perguntas Frequentes
QComo as propriedades unicode-bidi e direction se relacionam?
Adirection define a direção da escrita do texto; unicode-bidi controla como essa direção interage com o texto ao redor. As duas são normalmente usadas juntas: direction especifica a direção e unicode-bidi especifica o comportamento de isolamento ou substituição.
QQuando preciso da propriedade unicode-bidi para texto de direções mistas?
AQuando uma página mistura textos de direções diferentes (como árabe inserido em inglês), ou quando você precisa incorporar conteúdo de terceiros sem afetar o layout geral, use unicode-bidi: isolate para isolar o contexto de direção.
QQual é a diferença entre unicode-bidi: isolate e bidi-override?
Aisolate trata o texto bidirecional interno do elemento como um parágrafo independente, de modo que as direções não se afetam — ideal para conteúdo de terceiros ou multilíngue incorporado; bidi-override força toda a ordem dos caracteres conforme a direção, o que facilmente bagunça a exibição esperada e só serve para casos especiais.