-
Notifications
You must be signed in to change notification settings - Fork 2
RWD replace pull push trick
lululala edited this page Feb 5, 2017
·
4 revisions
當RWD xs的時候上下順序可以顛倒 情境：
<div class='row'>
<div class='col-sm-6'>AAA</div>
<div class='col-sm-6'>BBB</div>
</div>此時平板以上 會顯示 AAA在「左」 BBB在「右」
手機時 會顯示 AAA在「上」 BBB在「下」
如果想要
此時平板以上 會顯示 AAA在「左」 BBB在「右」
手機時 會顯示 AAA在「下」 BBB在「上」
則變成以下即可
<div class='row reorder-xs'>
<div class='col-sm-6'>AAA</div>
<div class='col-sm-6'>BBB</div>
</div>以下是code內容
.row.reorder-xs
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
direction: rtl;
margin-bottom: 30px;
.row.reorder-xs > [class*="col-"]
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
direction: ltr;