常用樣式，以便日后使用

QQ截圖20190718153927.png

html：

<view class='pageview'>
  <view class="pjo-list t-flex t-j-b t-a-i-c" bindtap='getMissionDetails'>
      <view class='info-left t-flex'>
        <view class='info-img margin-l30'>
            <image src='../../../images/lg.png'></image>
        </view>
        <view class='info-text t-flex t-column t-j-b margin-l30'>
            <text class='t-ov line50 font30 col-000'>15-16棟墻面粉刷</text>
            <text class='t-ov line50 font30 col-c4c4c4'>衡陽勝利駕校 </text>
            <text class='t-ov line50 font30 col-c4c4c4'>衡陽勝利駕校 </text>
        </view>
      </view>
      
      <view class='info-right t-flex t-j-c t-a-i-c margin-r30'>
            <text class='font32 col-e74a45'>已加入</text>
      </view>
  </view>
</view>

css:

.t-flex{
  display: flex;
}
.t-j-b{
  justify-content: space-between;
}
.t-a-i-c{
  align-items: center;
}
.t-column{
  flex-direction: column;
}
.margin-l30{
  margin-left: 30rpx;
}
.font30{
  font-size: 30rpx;
} 
.col-000{
  color: #000000;
}
.col-c4c4c4{
  color: #c4c4c4;
}
.col-9f9f9f{
  color: #9f9f9f;
}
.t-ov{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} 
.line50{
  line-height: 50rpx;
}

.pageview{
  width: 100%;
}
.pjo-list{
  width: 100%;
  height: 250rpx;
}

.info-img{
  width: 150rpx;
  height: 150rpx;
}
.info-img image{
  width: 100%;
  height: 100%;
}

.info-text text{
  width: 350rpx;
}

.info-right{
  width: 150rpx;
  height: 100%;
}