小程序背景图片从服务器获取,微信小程序button控件去边框、加背景图

button边框去除

相信大家开发微信小程序时使用button会遇到一些与预期效果不同的样式问题。例如button的边框无法去除,在为button设置圆角的时候周围会有一些"杂质",像这样:

边框的存在,使得显示效果并不理想

我们来看一下预期效果:

预期的效果,对比之下效果非常明显

话不多说,直接上关键代码,只需要css样式更改:/*button样式这里可以根据需求自定义,此处贴出完整css。文章结尾拓展话题会使用,感兴趣的同学可以阅读 */

.button{

width: 90%;

height: 80rpx;

color: white;

display: flex;

align-items: center;

justify-content: center;

font-size: 30rpx;

border-radius: 80rpx;

background-color: #FED322;

}

/*关键代码 .class::after{border:0} 或

.class::after{border:none}

去除边框 */

.button::after{

你可能感兴趣的:(小程序背景图片从服务器获取)