開發小程序的時候,遇到一個小bug,開發中使用到了 border-image 給view設置邊框圖以下圖小程序
使用的是base64字符直接添加瀏覽器
border: none;工具
border-bottom: 5rpx solid #E6E6E6;測試
border-image: url('data:image/png;base64......') 100% 0% round;url
當時是直接這種方式添加,在開發者工具和安卓機上是正常的,可是在ip6和ipx上發現view的上下邊都會有這個邊框,估計其餘iOS設備也同樣調試
按照設想是隻設置了下邊框,其餘邊框設置了none,就不會顯示纔會,後來調試發現設置border-image-slice爲25% 及以上時,就會出現上邊框,否則就不會出現,猜想多是這方面的緣由,而後修改成blog
border-image: url('data:image/png;base64......') 0% 0% 100% 0% round;ip
顯示正常開發
測試了下,在pc端Chrome瀏覽器沒有這個現象,Safari瀏覽器有這個狀況base64