1.flex布局中justify-content/align-items: end;ios不生效问题
// 把end 改为 flex-end
justify-content: flex-end;
align-items: flex-end;
2.文字溢出显示省略号——富文本在ios真机不生效
① css样式无效:安卓可,ios不可
.multiWrap {
word-wrap: break-word;
display:-webkit-box;
overflow:hidden;
text-overflow:ellipsis;
word-wrap:break-word;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
}
② 富文本外层包裹:安卓可,ios不可
<div style='display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;line-clamp: 3;overflow: hidden;height: 120rpx;'>{{富文本内容}}</div>
③ 提取富文本文字后加css样式:安卓可,ios可,不完美的解决办法
// 提取富文本文字+长度截取
function truncateHTML (htmlText, limit, indicator) {
var tempDiv = document.createElement('div')
tempDiv.innerHTML = htmlText
var text = tempDiv.textContent || tempDiv.innerText || ''
if (text.length > limit) {
text = text.substring(0, limit) + (indicator || '...')
}
return text
}
.multiWrap {
word-wrap: break-word;
display:-webkit-box;
overflow:hidden;
text-overflow:ellipsis;
word-wrap:break-word;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
}
文章来源地址https://www.toymoban.com/news/detail-601119.html
文章来源:https://www.toymoban.com/news/detail-601119.html
到了这里,关于前端vue/uniapp —— 兼容ios与安卓问题的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!