为什么Bootstrap 3.1.1反向列顺序？

Question

在Bootstrap 3.1.1中，列顺序似乎颠倒过来。为什么是这样？它如何被安全覆盖？

[class^="col"] { 
 
    border: 1px solid; 
 
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap-rtl.css" rel="stylesheet"/> 
 
<div class="container"> 
 
    <div class="row"> 
 
    <div class="col-xs-3">col 1</div> 
 
    <div class="col-xs-3">col 2</div> 
 
    <div class="col-xs-3">col 3</div> 
 
    <div class="col-xs-3">col 4</div>  
 
    </div> 
 
</div>

我的拳头的想法是只需添加：

[class^="col"] { 
    float: left; 
} 

但是它似乎很奇怪，引导将这种行为如果不使用它有意实现的东西运我只是想念。这就是说，如果它应该被删除，是否可以添加我在上面发布的float，无意中破坏了其他任何东西或者最好的解决方案？

注：对于它的价值引导3.3.7（最新）似乎已经扭转了浮动规则：

.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 { 
    float: left; 
} 

Answer 1

因为你引用的bootstrap-rtl版本。 RTL代表“从右到左”。如果你修复它，然后使用标准版，它工作正常：

[class^="col"] { 
 
    border: 1px solid; 
 
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap.css" rel="stylesheet"/> 
 
<div class="container"> 
 
    <div class="row"> 
 
    <div class="col-xs-3">col 1</div> 
 
    <div class="col-xs-3">col 2</div> 
 
    <div class="col-xs-3">col 3</div> 
 
    <div class="col-xs-3">col 4</div>  
 
    </div> 
 
</div>