未分类

微信小程序中button组件的边框设置的实例详解_JavaScript_脚本之家

23 3月 , 2020  

button的边框是用:after方式完结的,客商假诺在button上定义边框会并发两条线,需用:after的办法去覆盖私下认可值。借使设置了Button的背景象,未有用:after设置边框的颜料,则button的多少个角会现身模糊的尖角。如下图所示:

从上海体育场地能够看见,八个角不模糊了。

如有疑问请留言或许到本站社区交换座谈,多谢阅读,希望能协理到大家,多谢我们对本站的支撑!

总结:对于button的边框设置,要放在::after里面设置,才生效,要不然会现身种种刁钻奇异现象

校正:将.wxss代码改正如下:

如上海体育场地三个角会模糊。.wxss代码如下:

Wechat小程序中button组件的边框设置的实例详细解释

在这里地设置了边框的样式,不过还未有收效。

.clickEncryptBtn{ width:130px; border-radius: 3px; margin:20px auto; padding-top:2px; font-size:14px; background-color:#CC3333; color:white; overflow:hidden; height:40px; } .clickEncryptBtn::after{ border:1px solid #CC3333; } 

将Button的边框设寄放在::after属性里面

.clickEncryptBtn{ width:130px; border-radius: 3px; margin:20px auto; padding-top:2px; font-size:14px; background-color:#CC3333;  border:1px solid #CC3333 color:white; overflow:hidden; height:40px; } 


相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图