为了更清楚的了解黑管后天height,line-height和font-size 之间的不同与联系 ,做了以下这样一个小小的测试:
xml 代码
- <div style="height:20px;
- background:#efefef; font-size:12px; line-height:20px; padding:10px;">
- 无标题文档<a href="#">我是tiger</a>
- </div>
如图显示:
在不给定 行高line-height:20px的情况下,行高正常显示应该是12px+2px=14px;
而字体的显示区域是行高 (20xp)—真正的字体高度(11px)—2px,剩下的7px上下平分,先下后上(即剩余为单数时有可能下面比上面多出1px);
12号宋体汉字的真正大小11x11 px的正方体,字的真正高度只有11px.(在vista里得到了调整,还特别出了一种新的字体-微软雅黑 也真正实现了12x12 px);
可以通过以下方式解决这类问题:
在设计中涉及行高时通常让行高减去真正字高后,剩下的高度值为偶数,这样只需在padding时上面比下面多出2px就可以实现字体的真正垂直居中啦!
eg) font-size:12px;line-height:21px ; height:21px;padding:5px 0 3px 0;
5+5+11+2+5+3
分享到:
相关推荐
思源宋体-SourceHanSerifSC-Heavy.ttf
系统字体下载 字体文件-仿宋-黑体-楷体-楷体_GB2312-宋体_常规 系统字体下载 字体文件-仿宋-黑体-楷体-楷体_GB2312-宋体_常规 系统字体下载 字体文件-仿宋-黑体-楷体-楷体_GB2312-宋体_常规 系统字体下载 字体文件-...
在PDF文档中使用宋体,可以确保中文内容在不同设备和系统间保持一致的显示效果,减少因字体缺失导致的阅读困扰。 PDF(Portable Document Format)是一种由Adobe Systems开发的文件格式,其目的是为了跨平台分享...
字体前端字体-siyuansongti
ireport宋体显示异常,加粗失效,字体变形,加入此jar即可解决
标题和描述中提到的“中文宋体字体font,ttf,标准字体,不侵权,多平台通用,truetype”是关于计算机字体技术的一些关键点。这里我们详细探讨一下这些概念: 1. **字体(Font)**:字体是电脑显示或打印文字的样式。...