小編給大家分享一下微信小程序中如何實(shí)現(xiàn)按鈕去除邊框線分享頁(yè)面功能，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創(chuàng)新互聯(lián)公司致力于互聯(lián)網(wǎng)網(wǎng)站建設(shè)與網(wǎng)站營(yíng)銷，提供成都網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、網(wǎng)站開發(fā)、seo優(yōu)化、網(wǎng)站排名、互聯(lián)網(wǎng)營(yíng)銷、微信小程序、公眾號(hào)商城、等建站開發(fā)，創(chuàng)新互聯(lián)公司網(wǎng)站建設(shè)策劃專家，為不同類型的客戶提供良好的互聯(lián)網(wǎng)應(yīng)用定制解決方案，幫助客戶在新的全球化互聯(lián)網(wǎng)環(huán)境中保持優(yōu)勢(shì)。

有一個(gè)需求是分享當(dāng)前頁(yè)面，使用美工的分享按鈕圖片來(lái)分享，而小程序分享功能只有button有

open-type="share"這個(gè)屬性，使用image標(biāo)簽肯定不行。我是這樣做的：

<button open-type="share" 
 >
<image  src='../../../image/share_btn.png'></image>
</button>

加入css樣式去除button邊框

button::after{
border: none;
}

實(shí)際效果如下

這樣按鈕的邊框就消失了，單純的設(shè)置border:none和outline:none沒用。

小程序的分享事件

 /**
  * 用戶點(diǎn)擊分享
  */
 onShareAppMessage: function () {
  return { 
   title: '分享',
   desc: '活動(dòng)描述', 
   path: '/xxx/xxxx?id=' + this.data.id
  } 
 },

  下面在簡(jiǎn)單看下微信小程序的button去邊框代碼

 wxml

<button class='niu'>123123</button>

css

niu::after{
　　border:none;
}

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

本文標(biāo)題：微信小程序中如何實(shí)現(xiàn)按鈕去除邊框線分享頁(yè)面功能
網(wǎng)頁(yè)路徑：http://www.rwnh.cn/article44/jisghe.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站建設(shè)、做網(wǎng)站、企業(yè)網(wǎng)站制作、網(wǎng)站排名、企業(yè)建站、網(wǎng)站營(yíng)銷

廣告

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