微信小程序 图片

如果是一个单个的图片放在那里，即使给图片设置了宽高等于图片的宽高，因为图片有一个默认的display:inline-block,所以实际上会有一个间距存在。

设置前

中间这个图实际上应该与上下没有间隙的。

那么如何改掉呢？

给图片设置 display:block;就可以了。

设置后

再一个知识点：让文字高度居中。

以前只知道让高度等于行高可以让文字垂直居中，那么像现在一样需要让文字往下移动一点呢，此时想要居中：

background-color:#f4f4f4;
height:88rpx;
line-height:100rpx;
font-size:32rpx;
text-align:center;
color:#999;
width:100%;

图片高度的一半：25/2=12rpx;
原来的行高：88rpx
加上图片后的这个行高：88+12=100rpx;

设置圆角效果

小程序设置圆角效果，没有办法一下子设置很多个边，但是一个一个的角去设确是可以的。

.d_title{
  background-color: #f4f4f4;
  height:88rpx; 
  line-height:100rpx;
  font-size:32rpx;
  text-align: center;
  color:#999;
  width:100%;
  border-top-left-radius:8rpx;
  border-top-right-radius:8rpx;
}
.d_content{
  background-color: #fff;
  border-bottom-left-radius:8rpx;
  border-bottom-right-radius:8rpx;
}

不是，这个圆角效果设置的那个边的写法是有限制的，可以一下子设置四个。