怎么自定義微信小程序tabbar上邊框的顏色-創新互聯

這篇文章主要介紹了怎么自定義微信小程序tabbar上邊框的顏色，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

從網站建設到定制行業解決方案，為提供網站設計制作、成都網站建設服務體系，各種行業企業客戶提供網站建設解決方案，助力業務快速發展。創新互聯建站將不斷加快創新步伐，提供優質的建站服務。

我們知道tabbar上邊框的顏色是通過 tabBar 的 borderStyle 屬性設置的，只支持兩個值 black / white，參見文檔 tabBar

怎么自定義微信小程序tabbar上邊框的顏色

示例，紅色

解決辦法

其實很簡單，自己畫一條線定位在頁面最底部就可以了，我們可以利用小程序類似于網頁 <html> 標簽的 <page>標簽，在全局樣式中加入如下：

app.wxss

page::before{
  content: '';
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 2rpx;
  background-color: #F6F8FC;
  z-index: 9999;
}

同理，也可以給最上面也加入一個分割線，如下：

page::after{
  content: '';
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2rpx;
  background-color: #F6F8FC;
  z-index: 9999;
}

其他

是不是很簡單，如果在某個頁面不需要分割線，只需在當前頁面的 wxss 文件里重置 page 的樣式即可，如下：
details.wxss

page::before{
  height: 0rpx;
}

感謝你能夠認真閱讀完這篇文章，希望小編分享的“怎么自定義微信小程序tabbar上邊框的顏色”這篇文章對大家有幫助，同時也希望大家多多支持創新互聯，關注創新互聯行業資訊頻道，更多相關知識等著你來學習!

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

猜你還喜歡下面的內容

99偷拍视频精品区一区二,口述久久久久久久久久久久,国产精品夫妇激情啪发布,成人永久免费网站在线观看,国产精品高清免费在线,青青草在线观看视频观看,久久久久久国产一区,天天婷婷久久18禁,日韩动漫av在线播放直播