欧美三级国产三级日韩三级_亚洲熟妇丰满大屁股熟妇_欧美亚洲成人一区二区三区_国产精品久久久久久模特

微信小程序:button組件的邊框設(shè)置 - 新聞資訊 - 云南小程序開發(fā)|云南軟件開發(fā)|云南網(wǎng)站建設(shè)-昆明葵宇信息科技有限公司

159-8711-8523

云南網(wǎng)建設(shè)/小程序開發(fā)/軟件開發(fā)

知識

不管是網(wǎng)站,軟件還是小程序,都要直接或間接能為您產(chǎn)生價(jià)值,我們在追求其視覺表現(xiàn)的同時(shí),更側(cè)重于功能的便捷,營銷的便利,運(yùn)營的高效,讓網(wǎng)站成為營銷工具,讓軟件能切實(shí)提升企業(yè)內(nèi)部管理水平和效率。優(yōu)秀的程序?yàn)楹笃谏壧峁┍憬莸闹С郑?

您當(dāng)前位置>首頁 » 新聞資訊 » 小程序相關(guān) >

微信小程序:button組件的邊框設(shè)置

發(fā)表時(shí)間:2021-5-11

發(fā)布人:葵宇科技

瀏覽次數(shù):104

button的邊框是用:after方式實(shí)現(xiàn)的,用戶如果在button上定義邊框會出現(xiàn)兩條線,需用:after的方式去覆蓋默認(rèn)值。

如果設(shè)置了Button的背景色,沒有用:after設(shè)置邊框的顏色,則button的四個(gè)角會出現(xiàn)模糊的尖角。如下圖所示:

如上圖四個(gè)角會模糊。.wxss代碼如下:

  1. .clickEncryptBtn{
  2. width:130px;
  3. border-radius: 3px;
  4. margin:20px auto;
  5. padding-top:2px;
  6. font-size:14px;
  7. background-color:#CC3333;
  8. <strong> border:1px solid #CC3333</strong>
  9. color:white;
  10. overflow:hidden;
  11. height:40px;
  12. }

在這里設(shè)置了邊框的樣式,但是沒有生效。 
修改:將.wxss代碼修改如下:

  1. .clickEncryptBtn{
  2. width:130px;
  3. border-radius: 3px;
  4. margin:20px auto;
  5. padding-top:2px;
  6. font-size:14px;
  7. background-color:#CC3333;
  8. color:white;
  9. overflow:hidden;
  10. height:40px;
  11. }
  12. <strong>.clickEncryptBtn::after{
  13. border:1px solid #CC3333;
  14. }</strong>

將Button的邊框設(shè)置放在::after屬性里面。效果如下:


從上圖可以看出,四個(gè)角不模糊了。


總結(jié):對于button的邊框設(shè)置,要放在::after里面設(shè)置,才生效,要不然會出現(xiàn)各種怪異現(xiàn)象


相關(guān)案例查看更多