首页 文章

巧妙地使用text-align(如果arab dir = rtl,则为english dir = ltr)

提问于
浏览
10

我有一个社区网站,我希望用户写

  • 英文帖子方向LTR / text-align:left)和

  • 方向RTL / text-align:right的阿拉伯文帖子 .

例如 . 谷歌和Twitter提供了这样的POST解决方案 .

当我从rtl或ltr中的数据库后加载中读取它时,我想自动添加方向属性!但我不知道怎么样?!

5 回答

  • 1

    您需要创建一个函数,其中包含您知道的所有字母都是RTL并在加载时检查 . 要显示RTL,您需要CSS属性, directiontext-alignunicode-bidi .

    Demo:

    脚本

    function checkRtl( character ) {
        var RTL = ['ا','ب','پ','ت','س','ج','چ','ح','خ','د','ذ','ر','ز','ژ','س','ش','ص','ض','ط','ظ','ع','غ','ف','ق','ک','گ','ل','م','ن','و','ه','ی'];
        return RTL.indexOf( character ) > -1;
    };
    
    var divs = document.getElementsByTagName( 'div' );
    
    for ( var index = 0; index < divs.length; index++ ) {
        if( checkRtl( divs[index].textContent[0] ) ) {
            divs[index].className = 'rtl';
        } else {
            divs[index].className = 'ltr';
        };
    };
    

    CSS

    .rtl {
        direction: rtl; 
        text-align: right;
        unicode-bidi: bidi-override;
    }
    
    .ltr {
        direction: ltr; 
        text-align: left;
        unicode-bidi: bidi-override;
    }
    

    HTML

    <div>hello</div>
    <div>ظ</div>
    
  • 0

    您可以在html标签中指定 dir="rtl" ,以便使用php进行正确的演示

    在您的CMS中,或者如果您没有使用它,在将上下文存储到数据库时,您可以选择使用作者使用的文本方向存储变量 .

    因此,在获取帖子时,您还可以获取作者标记的选项 .

    否则,就像其他程序员所建议的那样,解析内容,看看它的阿拉伯字符或拉丁字符 .

    example

    <body dir="<?php se_11787707_get_post_language(); ?>">
    

    如果没有关于如何发布帖子的更多信息,我不能详细说明 . 请提供您存储帖子的方式以及如何获取帖子 .

    我使用这个tecnique Build 了一个网站,我每天处理阿拉伯语rtl内容 . 这很简单:

    a working example of dir="rtl"

    jsfiddle.net

    参考:w3.org

  • 1

    这很容易 . 您可以在Html元素中使用dir ='auto'Attribiute . 因此,如果您的文本是阿拉伯语或波斯语文本使用RTL,如果您的文本是英语自动文本使用LTR .

    <p dir='auto'>Hello</p>
    <p dir='auto'>سلام</p>
    
  • 2

    有一个只有CSS的解决方案:

    div {
        text-align: start;
        unicode-bidi: plaintext;
    }
    

    jsFiddle

    不幸的是,此解决方案不适用于Microsoft Edge .

  • 17

    实际上阿拉伯字母是这些字母

    var RTL = ['ا','ء','ب','ت','ث','ج','ح','خ','د','ذ','ر','ز','س','ش','ص','ض','ط','ظ','ع','غ','ف','ق','ک','ل','م','ن','و','ه','ی'];
    

    和波斯语(波斯语)字母是这些

    var RTL = ['ا','ب','پ','ت','ث','ج','چ','ح','خ','د','ذ','ر','ز','ژ','س','ش','ص','ض','ط','ظ','ع','غ','ف','ق','ک','گ','ل','م','ن','و','ه','ی'];
    

    如果检查第一个和第二个字母,它可能很有用,因为有时它可以通过子弹或类似的东西开始 .

    for ( var index = 0; index < divs.length; index++ ) {
        if( checkRtl( divs[index].textContent[0] ) || checkRtl( divs[index].textContent[1] ) ) {
            divs[index].className = 'rtl';
        } else {
            divs[index].className = 'ltr';
        };
    };
    

相关问题