从右到左语言的 div 流答案

【问题标题】：Flow of divs in right-to-left language从右到左语言的 div 流
【发布时间】：2015-04-07 14:45:59
【问题描述】：

是否可以在 HTML 中标记一组 div，以便它们在从左到右的语言中从左到右流动，而在从右到左的语言中从右到左流动？也就是说，流程将取决于 html lang 属性的设置。例如，如果您有以下情况

<html lang="en">

标记的 div 的流向是从左到右，而如果语言是希伯来语（一种从右到左的语言）

<html lang="he">

标记的 div 的流动是从右到左的。

【问题讨论】：

标签： javascript html css internationalization right-to-left

【解决方案1】：

也使用dir 属性。它可以在任何div 上运行，因此您可以随时更改它。

<html lang="he" dir="rtl">

不要忘记：您可能需要担心一些 CSS。我使用一个名为 R2 的项目来帮助解决这个问题。

【讨论】：

【解决方案2】：

我会使用 CSS 和 jQuery 来实现。 JSFiddle：http://jsfiddle.net/pxztk9ne/

默认方向是leftToRight，如果指定的语言在rightToLeftLangs-array 中，则具有此类的每个块都将向右浮动。此外，目前您必须使用 .html 元素中的语言，而不是 html 元素中的语言（jQuery 第 3 行）

$(document).ready(function() {
    var rightToLeftLangs = ['he'];
    if($.inArray($('.html').attr('lang'), rightToLeftLangs) > -1) {
        $('.leftToRight').removeClass('leftToRight').addClass('rightToLeft');
    }
});

.floating {
    position:relative;
    width:100px;
    height:100px;
    background:#eee;
}

.leftToRight {
    float:left;
}

.rightToLeft {
    float:right;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="html" lang="en"></div>
<div class="floating leftToRight">
    Some text
</div>

【讨论】：

如果关闭了 javascript 会怎样？
然后它使用默认方向，目前是 leftToRight