flex布局知识点Beta

先看图，实现下方列表中的效果，名字在左，数量在右，相对条目居中。

html代码

<view class="list">      <view>        <text class="sub">苏享茂</text>      </view>      <view class="num">117条</view>    </view>

css代码

.list{  font-size: 16px;  height: 36px;  padding: 8px;  background-color: white;  margin-top: 1px;  line-height: 36px;  display: flex; //布局方式  justify-content: space-between;// 项目在主轴上的对齐方式}.sub{  white-space: normal;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 1;  overflow: hidden;}.num{    flex-shrink: 0;    font-size: 12px;    color: #999999;}

相关文献：Flex 布局语法教程