展会信息港展会大全

IE9中CSS line-height的文字垂直居中无效
来源:互联网   发布日期:2016-03-25 16:06:39   浏览:1726次  

导读:在ie9中有不少朋友会发现CSS中的line-height控制的文字垂直居中无效问题,下面小编来给各位朋友详细介绍此问题的具体解决方法。在IE9常常会遇到写的DIV+CSS网页,文字有时不能...

在ie9中有不少朋友会发现CSS中的line-height控制的文字垂直居中无效问题,下面小编来给各位朋友详细介绍此问题的具体解决方法。

在IE9常常会遇到写的DIV+CSS网页,文字有时不能垂直居中使用line-height根本无效,即使可以设置IE浏览器的兼容模式,但对于访客而言不可能每个人都会去设置兼容模式浏览,只能算是掩耳盗铃的解决办法,怎么办呢?只好搜索了,百度了一下才找到原因,原来IE9不支持line-height的原因是中文ie9不支持英文字体,而我刚好使用的是英文字体。

在IE9看见自己使用line-height设置垂直居中文字不能垂直居中,这是与你设置字体有关,通常大家习惯设置

代码如下

复制代码

font-family:Arial, Helvetica, sans-serif;

ie9中line-height失效解决方法:

只需设置好字体,添加个宋体即可解决 如CSS代码

代码如下

复制代码

font-family:Arial, "宋体",Helvetica, sans-serif;

设置字体时候注意,还需设置大家都默认系统自带字体,如黑体,宋体。

在中文IE9中不认英文字体,所以IE9找不到设置中文字体,所以对导致字体上下垂直失效。

如果在CSS中一定只使用中文字体时如何办,我们可以将中文字体名称转换为Unicode编码。

Unicode编码转换示范:

宋体:5B8B4F53

黑体:9ED14F53

微软雅黑:5FAE8F6F96C59ED1

大家可以记住保存以上网址,以便开发CSS时候将中文转换Unicode做参考。

如下:

代码如下

复制代码

div{font-family:"宋体";}

转后:www.111cn.net

div{font-family:"5B8B4F53";}

设置字体时候注意,还需设置大家都默认系统自带字体,如黑体,宋体。

在中文IE9中不认英文字体,所以IE9找不到设置中文字体,所以对导致字体上下垂直失效

例子A:将中文字体汉字转换为Unicode编码

汉字字体中文字转换为Unicode编码后字体效果相同,不受影响,兼容各大浏览器。

将汉字转换为Unicode编码的字符,即成功设置相应字体,又兼容IE9浏览器支持垂直居中line-height样式。

如:

代码如下

复制代码

.div{ font-family:"微软雅黑"}

转换为Unicode编码后

.div{ font-family:"5FAE8F6F96C59ED1"}

例子B:将中文字体汉字使用英文名

将CSS+DIV布局中CSS设置中文字体汉字转换对应英文名字体,转换后设置中文字体效果不变,并兼容各大浏览器。

如:

代码如下

复制代码

.div{ font-family:"微软雅黑"}

转换为英文名后

.div{ font-family:"Microsoft YaHei"}

赞助本站

人工智能实验室

相关热词: 开发 编程 android

AiLab云推荐
展开

热门栏目HotCates

Copyright © 2010-2024 AiLab Team. 人工智能实验室 版权所有    关于我们 | 联系我们 | 广告服务 | 公司动态 | 免责声明 | 隐私条款 | 工作机会 | 展会港