移动端的行高问题

已于 2023-02-24 19:53:16 修改
阅读量98 收藏
点赞数
文章标签： css
于 2017-02-09 15:50:00 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_35073135/article/details/129154907
版权

　　今天在做移动端页面布局的时候，发现一个有趣的现象，就是在不同的手机品牌上，字与字之间的间距表现的形式不一致，具体的情况是红米note和苹果的表现是一致的，而三星和魅蓝note1表现是一致的(果然是水火不相容)。红苹果阵营是表现的间距小，蓝三星变现正常。但是这是万万不可的啊，产品怎么能答应呢，(如上图)然后我就开始了慢慢的找寻bug的路，最后在度娘等众多的答案与我的重重考虑中。我发现了，竟然是行高的问题，当我不设置行高的时候，也就是行高是默认值line-height: initial的时候，每个手机的默认是不同的，具体的请自行体会。所以不管怎么修改两个阵营的显示效果是不一样的。SO，我们就要自行设置了，不能使用默认值，这个bug也就解决了。哈哈哈                    

程先生哈
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
移动端line-height问题
03-07 126
转抄：http://blog.csdn.net/wjnf012/article/details/54316058最近碰到了这样一个问题，设置line-height属性让文字垂直居中，发现在PC端肉眼观察是居中的，但是在移动端（Android）上总是发现文字偏上，所以有以下的研究。 搜索发现有人说在Android上会有2px的向上偏移，但是实践证明并不是，下面上图(本来准备制成表格比较起...
移动端布局笔记
wangcles的博客
04-02 1144
前端移动端基础
2023 Android面试官 常问的问题以及答案（附最新的Android面试大厂必考174题 ）
Android23333的博客
03-09 8578
2023 Android面试官 常问的问题以及答案（附最新的Android面试大厂必考174题 ）
line-height 和 vertical-align 行高与行对齐精解 （图文）
09-25
行高指的是文本行的基线间的距离，但是文本之间的空白距离不仅仅是行高决定的， 同时也受字号的影响。
拖动table单元格改变列宽或行高
06-22
本文将深入探讨如何实现“拖动table单元格改变列宽或行高”的功能，以及这一特性在表格设计器中的应用。 首先，我们要理解HTML表格的基本结构。一个HTML表格由`<table>`元素定义，包含多个`<tr>`（行）元素，每个`...
移动端常用样式以及特效
03-24
3. 行高与字间距：合理设置行高和字间距，增加可读性。 4. 对齐方式：左对齐、右对齐、居中等，根据设计需求选择合适的文本对齐。 三、颜色设计 1. 色彩理论：理解色彩心理学，选择符合品牌调性的颜色搭配。 2. ...
html、css qq音乐移动端静态页面
最新发布
04-10
5. 字体和色彩管理：定义品牌一致的字体家族、字号、行高和颜色方案。 此项目仅包含两个页面，这可能指的是主页和歌曲详情页。主页通常包含搜索框、推荐歌单、热门歌曲等模块；而歌曲详情页则会展示单曲的信息，如...
js实现移动端tab切换时下划线滑动效果
12-08
每个`<li>`元素都有相对定位，并设置了内边距、颜色和行高。`::before`伪元素用于创建下划线，它被设置为绝对定位，初始状态下位于元素的右侧。通过`transition`属性，我们可以添加平滑的过渡效果，当`<li>`激活或...
关于height、offsetheight、clientheight、scrollheight、innerheight、outerheight的区别一览
肖皓文
02-12 1238
 原文：https://www.cnblogs.com/layaling/p/6223372.html 平时，不管在pc端页面还是移动端页面，因为我们一般很少会设置某个块的的高度，但是呢，我有时候有需要取到这些高度以便于我们方便进行判断和下一步的编写。一般这个时候我都是直接的获取一个块的高度.height()，来解决，但是有的时候我翻翻查查发现还有offsetheight，而这两者之间还是有一些...
移动端常见的高度问题的解析
Oliver_web的博客
10-17 1458
var h = ""; h += " 网页可见区域宽："+ document.body.clientWidth+"\n"; h += " 网页可见区域高："+ document.body.clientHeight+"\n"; h += " 网页可见区域宽："+ document.body.offsetWidth +" (包括边线和滚动条的宽)"+"\n"; h += " 网页可见区域高："
手机端多个div一行显示宽高相同并且自动适配（纯css）
Fan Ruitian的博客
12-27 5186
一帮来说，pc端的静态页一般都是像素为基本单位，基本都是卡尺卡出来的，只要是有耐心，一般没什么大问题 而移动端的对应的终端的屏幕的大小差异太大了，为了适配不同的屏幕这时候就不能以像素px为单位了，更多的是相对的百分比% 一行平均显示两个圆并且宽高相同而且随着屏幕的大小的变化进行缩放，一般来说可以这样 一个大div中2个小div，这两个小div宽带是大div的50%，高度呢就有些说法了
h5 移动端 字体行高偏上问题
weixin_33997389的博客
06-05 2372
才发现 移动端项目怎么会有那么多问题呢？ 现在不用搞ie的hack兼容问题了 又来了h5的兼容 哎，问题还是得解决啊 言归正传 问题：移动端h5页面，文本行高偏上的问题，（据说ios手机没有），咱也没ios手机，咱也不敢问啊，有的大佬试试 当我们使用rem，em，作适配时，字体可能出现奇数，带小数点的，字体大小，当字体大小小于12px时，安卓手机为避免奇数字体带来的偏差...
关于移动端开发宽度高度，字体以及rem宽度使用的总结
hellogoodman的博客
04-07 9123
遇到的问题：如何适配不同的手机屏幕。 简单的说media query可以解决一部分。但是media query目前是照着iphone5/iphone/iphone6s 三个不同尺寸来进行。 如果手机尺寸不在这三个范围之内，那么元素的宽度可以按照百分比来处理，但是高度就不行了。 比如就会出现在轮播图的情况下，原来的高度是写死如iphone5 200px;iphone6 2
ui设计移动端字体适配_UI设计中字体的相关属性！
weixin_35734364的博客
01-02 745
前言：对于一名UI设计师来说，字体是一门基本语言，更是设计师需要掌握的基本技能之一。目前常用的字体有很多种，比如黑体、宋体、楷体、阿里普惠体等。在平时的项目设计中，为了让页面中的字体更加贴合业务场景，设计师需要对字体的字距字高进行调整。接下来UI范就给大家讲解一下字体的相关属性。 1.字体基础结构详解 一般来说，为了保持字体的完整展示，字体设计师都会给字体预留一定的安全距离，设定合适的升部线及...
移动端line-height垂直居中问题
Jaya先生的博客
01-10 1537
在安卓机上使用line-height垂直居中，有时会有些许偏差，但是css完全是没有问题的。先搬运一下其他博主的分析：http://www.fly63.com/article/detial/399?type=1 解决方案： 方法一：运用flex布局 &lt;span class="test"&gt;{{ item.value }}&lt;/span&gt; .test { di...
quill-editor行高问题
07-28
对于Quill Editor中的行高问题，你可以使用CSS来调整行高。Quill Editor是基于contenteditable属性构建的富文本编辑器，因此你可以通过修改其样式来改变行高。 你可以使用以下代码来设置行高： ```css .ql-editor ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值