2013-08-29 21 views
9

Bootstrap 2'den önce, yüzenleri ters çevirerek ızgaralardaki yığınlama sırasını tersine çevirebilirsiniz.Önyükleme sırasındaki önyükleme sırası 3?

bootstrap 3'te bu işe görünmüyor. Bana bootstrap 3 için çözümler söyleyebilir misiniz?

Her türlü yardım takdir edilecektir. .

+0

Ben, onların örnekler üzerinde yüzen ters çalışan bir cazibe gibi çalıştı olduğunu. Başka bir şey senin için yanlış olabilir. – Razz

+0

Reversing floats Bootstrap 3'te çalışmıyor, onaylandı. Bass Jobs'ın aşağıdaki cevabı doğru. – Brant

cevap

15

Kullanım .col-md-push-* ve .col-md-pull-* değiştirici sınıfları, bkz: http://getbootstrap.com/css/#grid-column-ordering

örnek:

<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> 
2

Bootstrap 3'te Eğer col-md-itme ve col- kullanabilirsiniz md-pull-.
İşte tam kod.
Umarım bu probleminizi çözecektir.

<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>

Run

Burada ayrı bir HTML sayfası

bu kod anlık enter image description here