微信小程序text设置高度_微信小程序-text组件width失效问题

一、text组件使用

想要的效果

1538017578(1).jpg

1、wxml布局

{ {category.name}}

2、wxss样式

.home-category-name-contain {

padding-top: 50rpx;

padding-bottom: 50rpx;

text-align: center;

}

.home-category-name {

color: #005cb7;

font-size: 56rpx;

border-top: 2rpx solid #005cb7;

border-bottom: 2rpx solid #005cb7;

border-image: linear-gradient(to left, #efefef, #005cb7, #efefef);

border-image-slice: 10;

line-height: 120rpx;

height: 120rpx;

width: 200rpx;

text-align: center;

}

3、效果

1538017752(1).jpg

4、问题

1、width的宽度无论设置多宽，边框长度无效

5、解决

.home-category-name {

color: #005cb7;

font-size: 56rp