在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML5/ flex 布局

flex 布局

<view style='display:flex'>
  <view style='display:flex;flex:1;flex-direction:column;align-items:stretch;'>
    <view class=''>小計：<text style='color:#ff0000'>￥{{ sum - promTotal }}</text></view>
    <view style='display:flex;'>
      <view style='margin-right:30rpx;'>總額：￥{{ sum }}</view>
      <view style='flex:1;'>優(yōu)惠：-￥{{ promTotal }}</view>
    </view>
  </view>
  <view style='background-color:#ff0000;align-items:stretch' bindtap='placeAnOrder'>去下單</view>
</view>

clipboard.png

在現(xiàn)有樣式下，如何讓圖片上的 “去下單” 垂直居中 ？

回答
編輯回答
我不懂

line-height雖然能解決你的部分問題，但是他會局限你的適配方案，目前不知道你的適配方案，所以只能給出次回答。

2017年1月2日 23:44
編輯回答
詆毀你

以下代碼和提問代碼有些許不同，但解決思路是一樣的

<view style="background-color:#fff;margin-bottom:18rpx;padding-left:30rpx;">
  <view style='display:flex;align-item:center;background-color:#ff0000;'> //背景設(shè)為紅色
    <view style='display:flex;flex:1;flex-direction:column;background-color:#fff;padding:26rpx 0;'> // 左側(cè)背景設(shè)為白色，擋住左邊的父元素設(shè)置的紅色背景
      <view style="color:#232326;">實付：<text style="color:#d4372f;">￥4450.00</text></view>
      <view style="font-size:28rpx;color:#848689;" wx:if="{{true}}">累計節(jié)?。海?030</view>
    </view>
    <view style="width:232rpx;text-align:center;color:#fff;">提交訂單</view>// 右邊不用設(shè)背景，直接顯示的就是父元素的紅色背景
  </view>
</view>

clipboard.png

2017年12月16日 19:45
編輯回答
尐懶貓

把“去下單”再包一層flex容器，align-items:center"控制垂直居中

...

<view style="display:flex; align-items:center">
  <view style='background-color:#ff0000;' bindtap='placeAnOrder'>去下單</view>
</view>

flex布局參考：http://www.ruanyifeng.com/blo...

2018年7月1日 06:34