css中英文字母和汉字行高不同的解决方法

2022-09-08发布者:ylm大小: 下载:0

文件大小:

软件介绍

产生的原因:

  全汉字的时候:

  一般情况在选中文本可以看出汉字是上对齐的(具体表现是选中字体,从背景上看上去下面多了一部分,用css术语讲就是产生了padding-bottom属性,为了说明问题暂且就说存在padding属性吧)。

  全英文字母的时候:

  类似于全汉字在全英文的情况下是下对齐,会出现类似padding-top的属性。不管是全汉字还是全英文这时候的行高是一样的。

  字母汉字混合:

  但是如果把汉字和英文字母混合在一起的时候就可以看出来差别了,这时候再选中所有字体就可以看出来这时候是的补白是 padding=padding-top+padding-bottom,也就是会多出来一个padding-top(也可以说是padding- bottom),一般字体在12px的情况下,多出来的部分大概是2px。

  解决办法:

  更改字体:

  本来想使用line-height固定的,但是line-height是每一行的基线与基线之间的距离,又因为汉字的基线和英文字母是不同的,所以起不到作用,再说如果是用作导航菜单只有一行还是没有用的。

  这样只有从字体上下手了,还真有一种字体可以解决这个问题,这个字体就是“simsun”,“simsun”就是传说已久的“宋体”,在windows字体文件夹下“宋体”的文件名就是“simsun”,他的兄弟“simhei”就是通常说的“黑体”。

发表评论(共0条评论)
请自觉遵守互联网相关政策法规,评论内容只代表网友观点,发表审核后显示!

版权声明:

1 本站所有资源(含游戏)均是软件作者、开发商投稿,任何涉及商业盈利目的均不得使用,否则产生的一切后果将由您自己承担!

2 本站将不对任何资源负法律责任,所有资源请在下载后24小时内删除。

3 若有关在线投稿、无法下载等问题,请与本站客服人员联系。

4 如侵犯了您的版权、商标等,请立刻联系我们并具体说明情况后,本站将尽快处理删除,联系QQ:2499894784

返回顶部