先上效果图
原理很简单，就是在原文本结尾补个会换行的空标签，模拟成2行文本
wxml
<view class="eat"> <view>早上吃什么<text></text></view>: 洗衣粉 </view> <view class="eat"> <view>午餐呢<text></text></view>: 肥皂 </view> <view class="eat"> <view>最重要的晚餐<text></text></view>: 沐浴露 </view>
|
wxss
padding: 0 20rpx; background-color: #fff}.eat { line-height: 100rpx}.eat + .eat { border-top: 1rpx solid #f5f5f5}.eat view { height: 100rpx; width: 240rpx; display: inline-block; text-align: justify; vertical-align: top}.eat view text { display: inline-block; height: 0; width: 100% /* 换行 */
|
在ios真机上无效，用最笨的办法吧，把每一个字用<text>标签包起来，外面用flex布局，justify-content: space-between; 搞定
+10086 666
手动点赞