平时在移动端开发拼页面的过程中总会遇到一些问题，主要是各手机webview样式显示效果不一致造成的。以下总结了一些常见坑和一些小技巧，希望对看官有所帮助！本文只针对两大手机阵营 Android和IOS 中的魅蓝metal 和 iPhone6进行样式对比。
一、line-heightline-height经常用于文字居中，当然也有小伙伴会用上下padding去写.but！不管你用padding还是line-height，不同手机显示效果还是…不一样。一般会这样写
嗯，在我们的chrome由于字体小于9px已经看不出边框和字之间的间隙了，再来看看Android和IOS的
魅蓝文字已经飞起~
正常显示如果把line-height加1px，iPhone文字就会下移，由于我们app的ios用户居多，并且android机型太多，不同机型也会显示不同，所以只能退而求其次了。line-height的兼容问题不太好解决，容器高度越小，显示效果的差距越明显。稍微大一点的高度，最好把line-height设置为高度+1px，两个平台显示都还不错。
二、角标的实现
不少项目ui会要求我们画这种梯形角标。问题来了
1.我们不确定角标内容的长度
2.角标的底色不能定死，能定死（能定死的话直接切个小体形就行了）通常就是一段文案后边拼接一个三角形，三角形很好写
本文来自作者[翦志]投稿，不代表调研号立场，如若转载，请注明出处：https://kydy.org.cn/miao/3575.html
评论列表（4条）
我是调研号的签约作者“翦志”！
希望本篇文章《html字体样式代码大全（html修改字体为宋体）》能对你有所帮助！
本站[调研号]内容主要涵盖：调研号,生活百科,小常识,生活小窍门,百科大全,经验网
本文概览： 平时在移动端开发拼页面的过程中总会遇到一些问题，主要是各手机webview样式显示效果不一致造成的。以下总结了一些常见坑和一些小技巧...