微信小程序:样式,上下居中,圆角,阴影,text行数等

上下左右居中 正中心,垂直居中

/* 正中心 */
.center{
  display: flex;
  justify-content: center;
  align-items: center;
}

/* 垂直居中 */
  display: flex;
  flex-direction:column;
  justify-content: center;

阴影

box-shadow: 4rpx 4rpx 4rpx 4rpx rgba(85, 85, 85, 0.05);

要使用rgba(),不能使用#fff,要不然颜色效果实现不了

弧度,圆角,边框粗度,颜色

border-radius: 70rpx;
border: 8rpx solid white;

text行数

  display: -webkit-box;
  word-break: break-all;
  -webkit-box-orient: vertical;
  /* 以下是限制单行  -webkit-line-clamp 就是行数  如果为1就是一行  2就是两行  */
  -webkit-line-clamp:2;       
  overflow: hidden;
  text-overflow:ellipsis;