Question

我正在使用BOOTSTRAP 3，我放了2个div：s 1. <div class="col-md-4">1</div>
2. <div class="col-md-8">2</div>

看起来像这样：

现在，如果我将分辨率更改为移动设备或平板电脑视图，它看起来像这样：

这个问题从我这里开始。我希望移动设备中的div顺序为div[2]位于顶部，div[1]位于底部。

PS：我正在使用direction:rtl。

Answer 1

在设计自适应网站时，请始终设计移动优先。这意味着您的HTML代码代表移动设备上的布局。

首先保持div [2]，默认为div [1]秒。然后在更大的屏幕尺寸上改变他们的行为。

因此，您可以按如下方式修改代码： -

<div class="col-xs-12 col-md-8 col-md-push-4">2</div>
<div class="col-xs-12 col-md-4 col-md-pull-8">1</div>

在移动设备上，两个div的宽度相等，div [2]将出现在div [1]之前（参见图表）。但在桌面及以上版本中，div [2]将被推向右侧，div [1]将被拉向左侧，从而产生所需的顺序。

希望这有帮助！： - ）

Answer 2

在bootstrap中向左方向使用rigth时，您需要创建一个自定义bootstrap css用于对齐，您可以为类float:right创建样式而不是左侧

根据你的css知识，这可能是一项艰巨的任务。

您还可以查看此库，这可能有助于bootstrap rtl。