今天在做uni-app項目進行測試時,發現當邊框爲1upx時,某些框的邊顯示不全(無效)。自己某前遇到問題的手機:iPhone XS Max。展示的bug效果如下:
以上區域中,發現邊框的下邊沒有顯示出來。又是兼容問題導致的bug。於是網上去查找了一些資料,大致歸類爲以下幾種。
1、將邊框樣式寫在“行內樣式”中,即以style的形式嵌在標籤中。親測無效,對於我的項目。大家可以針對自身項目自測下。
2、修改父容器的寬度爲奇數或奇數.5
自己用這種方式也無效,最後通過如下設置解決 :將父元素的高設置爲奇數或奇數.5。(學會了借鑑,哈哈)
說明:
1>自己項目中爲上或下邊1upx border無效的情況。如果是左或右1upx border無效的話,可以將父元素的寬設置爲奇數或奇數.5。
2>其他單位(如1px、1upx等)的border 出現此類情況,也可以用該手段。
3>至於爲什麼會造成這種兼容bug,至今不知是如何導致的。
具體分析過程請參考(此文章是左或右)無效的請求:https://blog.csdn.net/c5211314963/article/details/80323443