2011-04-27 8 views
24

Como es posible que sepa, algunos idiomas están escritos/leídos de derecha a izquierda y estamos intentando admitir algunos lenguajes RTL. Para la interfaz de usuario web, usar dir = "rtl" en html hace la mayor parte del trabajo gracias a los algoritmos que tienen los navegadores. Pero me encontré con este problema con corchetes en el texto:¿Cómo resolver los problemas con el soporte BiDi?

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Bracket problems with BiDi</title> 
</head> 
<body> 

<p style="direction: rtl;">Bracket problem: hello (world):</p> 
<p style="direction: rtl;">No bracket problem: hello (world) something:</p> 
<p style="direction: rtl;">Bracket problem: (السلام (عليكم </p> 
<p style="direction: rtl;">No bracket problem: السلام (عليكم) عليكم </p> 

</body> 
</html> 

problema se puede ver aquí: Screenshot

así que quiero que la última estancia de soporte en el extremo. ¿Cuál sería tu solución?

Respuesta

20

Aquí hay muchos problemas. De acuerdo con el estándar Unicode, los paréntesis son neutrales, lo que significa que no se tratan intrínsecamente como LTR o RTL. Toman la dirección de su lenguaje circundante. En los ejemplos en los que se representa incorrectamente, se supone que la dirección del corchete de cierre es la misma que la del inglés, es decir, LTR.

1er problema: Usted le dice al navegador que el párrafo debe tratarse como RTL. El navegador encuentra el inglés dentro, que es LTR, por lo que cree que el inglés está incrustado dentro de un párrafo RTL, y el último carácter ")" se trata como RTL. (el párrafo circundante es RTL).

2do problema: No hay problema aquí, de un simple vistazo al código fuente que ha proporcionado, parece que ha proporcionado los corchetes correctamente. Pero, de hecho, el corchete de cierre que debería estar después del texto RTL y antes del cierre </P > es en realidad antes del texto RTL de inicio. Si lo escribe correctamente, se verá mal (porque el editor de texto que está utilizando asume que el corchete final es LTR según Unicode). Para verificar esto, copie los contenidos en su editor, coloque el cursor al final de "problema:", presione la flecha derecha varias veces y observe la ubicación del último corchete.

Sin dar más explicación, he aquí algunos ejemplos para conseguir este trabajo:

<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <title>Bracket problems with BiDi</title> 
</head> 

<body> 
    <p style="direction: rtl;"><span dir="ltr">Bracket problem no more: hello (world):</span></p> 
    <p style="direction: rtl;"><span style="direction: ltr; unicode-bidi: embed">Bracket problem no more: hello (world):</span></p> 
    <p style="direction: rtl;">Bracket problem no more: السلام (عليكم)</p> 

    <!-- style for p tag below is ltr by default --> 
    <p>Bracket problem no more: <span dir="rtl">السلام (عليكم)</span></p> 
    <p>Bracket problem no more: <span style="direction: rtl; unicode-bidi: embed">السلام (عليكم)</span></p> 
</body> 
</html> 

Hay diferencias en cómo style = "dirección: LTR;" funciona y dir = "ltr" funciona, así que he dado ejemplos de ambos. Además, como supongo que básicamente necesitas resolver tu segundo problema, donde mayormente tienes texto RTL en un documento LTR, he proporcionado los dos últimos ejemplos.

NOTA: Si los últimos dos ejemplos son lo que está buscando, y va a usar CSS, se requiere la propiedad unicode-bidi, y eso hace toda la diferencia entre trabajar y no trabajar.

+1

Gracias por la explicación detallada; fue realmente útil ... Como referencia para el resto del mundo, este es un buen enlace también: http://www.w3.org/International/questions/qa-bidi-controls – erdogany

+0

Ninguno de estos funciona en el escenario donde usted tiene una lista desplegable y ltr cambia más que solo los corchetes, representa el desplegable en el reverso. Estoy buscando una solución donde la lista desplegable sigue siendo rtl, pero el texto en el interior es ltr o simplemente cualquier solución que no estropee los corchetes. – Nick

+0

¿Tiene el menú desplegable como LTR y luego cada elemento dentro de

12

Simplemente necesita agregar el carácter LRM después del último corchete. entidad HTML: &#x200E;

<html dir="rtl"> 
<body> 
<p>hello (world)&#x200E;</p> 
</body></html> 

Esto le dice al navegador para interpretar los soportes como de izquierda a derecha lectura.

1

se puede poner el siguiente CSS para su problema "unicode-bidi: embed" en el cuerpo de la etiqueta, no tendrán ningún problema

+0

No sé cómo pero ** unicode-bidi: texto claro; ** funcionó para mí – Suresh

4

respuesta de silkfield me llevó a this página que muestra muchos de los posibles problemas con diseños BiDi incluida la cuestión soporte

enter image description here

+0

¡Guau! Estoy usando Windows durante una década, pero no me di cuenta de que podía insertar estos caracteres simplemente con el botón derecho. Muchas gracias por las imágenes. – PHPst

Cuestiones relacionadas