index.wxml:
<view class="slogan"> <text> 建立跨文化的全球视野,做世界公民 </text> </view>
index.wxss:
.slogan{ padding:19rpx 0; background-color: #39B371; text-align: center; color:#FFFFFF; } .slogan>text{ font-size:20rpx; line-height: 20rpx; }
效果:
明显看到上边距多了,我们将text设置为block块:
.slogan>text{ font-size:20rpx; line-height: 20rpx; display: block; }
检查下来发现text有个内边距。
这个问题,解决也很简单,就是text内容不要写成几行,一行就可以了:
<view class="slogan"> <text>建立跨文化的全球视野,做世界公民</text> </view>
对,就是这么简单。
题外话,text更像h5里面的span而不是p,并不是一个块级元素。