顛倒引導程序3中的堆疊順序？

在引導2之前，您可以通過反轉浮動來反轉網格中的堆疊順序。顛倒引導程序3中的堆疊順序？

在bootstrap 3中，這似乎不起作用。任何人都可以告訴我bootstrap 3的解決方案嗎？

任何援助將不勝感激。。

來源

2013-08-29 Jamie Keith French

我試圖扭轉自己的例子彩車，工作就像一個魅力。別的東西可能對你來說是錯的。 – Razz

反向浮動在Bootstrap 3中不起作用，已確認。貝斯Jobsen的答案在下面是正確的。 – Brant

使用.col-md-push-*和.col-md-pull-*改性劑類，請參見：http://getbootstrap.com/css/#grid-column-ordering

例如：

<div class="container"> 
<div class="col-sm-5 col-sm-push-7" style="height:50px;background-color:green;">first right</div> 
<div class="col-sm-7 col-sm-pull-5" style="height:100px;background-color:red;">second left</div> 
</div>

來源

2013-08-31 11:07:09

在引導3，你可以使用COL-MD-推和同事md-pull-。
這是完整的代碼。
我希望這會解決您的問題。

<html><head> 
 
\t <title>Bootstrap in practice: the grid system</title> 
 
\t <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
 
\t <!-- Bootstrap CSS --> 
 
\t <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"> 
 

 
\t <!-- To better visualize the columns --> 
 
\t <style> 
 
\t .row > div { 
 
\t \t background-color: #dedef8; 
 
\t \t box-shadow: inset 1px -1px 1px #444, inset -1px 1px 1px #444; 
 
\t } 
 
\t </style> 
 

 
</head> 
 
<body> 
 
<div class="container"> 
 

 
\t <h1>Hello, world!</h1> 
 

 
\t <div class="row"> 
 
\t \t <div class="col-md-4 col-md-push-8">I was left</div> 
 
\t \t <div class="col-md-8 col-md-pull-4">I was right</div> 
 
\t </div> 
 
</div> 
 

 
</body></html>

運行這段代碼在不同的HTML頁面

這裏是快照

來源

2015-03-18 23:35:56 sudhir600

顛倒引導程序3中的堆疊順序？

回答

相關問題