微信小程序中button如何去除默認(rèn)邊框-創(chuàng)新互聯(lián)

這篇文章主要為大家展示了“微信小程序中button如何去除默認(rèn)邊框”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“微信小程序中button如何去除默認(rèn)邊框”這篇文章吧。

專業(yè)成都網(wǎng)站建設(shè)公司，做排名好的好網(wǎng)站，排在同行前面，為您帶來客戶和效益!創(chuàng)新互聯(lián)為您提供成都網(wǎng)站建設(shè)，五站合一網(wǎng)站設(shè)計(jì)制作，服務(wù)好的網(wǎng)站設(shè)計(jì)公司，做網(wǎng)站、成都網(wǎng)站設(shè)計(jì)負(fù)責(zé)任的成都網(wǎng)站制作公司!

微信小程序中button去除默認(rèn)的邊框的實(shí)現(xiàn)方法如下所示：

button {
 position:relative;
 display:block;
 margin-left:auto;
 margin-right:auto;
 padding-left:14px;
 padding-right:14px;
 box-sizing:border-box;
 font-size:18px;
 text-align:center;
 text-decoration:none;
 line-height:2.55555556;
 border-radius:5px;
 -webkit-tap-highlight-color:transparent;
 overflow:hidden;
 color:#000000;
 background-color:#F8F8F8;
}

這是button默認(rèn)自帶的css樣式

正常來說，去除button我們使用如下代碼即可

button{
 border:none;
}
或者
button{
 outline: none;
}

但是有時(shí)候卻不起作用，這個(gè)時(shí)候我們可以使用::after 偽類選擇器，因?yàn)閎utton的邊框樣式是通過::after方式實(shí)現(xiàn)的，如果在button上定義邊框就會出現(xiàn)兩條邊框線，所以我們可以使用::after的方式去覆蓋默認(rèn)值。

button::after {
 border: none;
}

這樣就可以搞定小程序按鈕默認(rèn)樣式了，只是相當(dāng)于一個(gè)文本的樣式，還是有很多button的默認(rèn)樣式?jīng)]有去除的，這個(gè)需要根據(jù)個(gè)人需求來設(shè)置的，這里不過多說明，后續(xù)有再遇到相關(guān)情況，再續(xù)更，如果需要自定義可以在按鈕上一個(gè)類選擇器就可以搞定。

以上是“微信小程序中button如何去除默認(rèn)邊框”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

名稱欄目：微信小程序中button如何去除默認(rèn)邊框-創(chuàng)新互聯(lián)
本文來源：http://muchs.cn/article22/iccjc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供面包屑導(dǎo)航、電子商務(wù)、虛擬主機(jī)、網(wǎng)站排名、響應(yīng)式網(wǎng)站、網(wǎng)站內(nèi)鏈

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)