最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
IE9中CSS line-height的文字垂直居中无效
时间:2014-02-17 编辑:简简单单 来源:一聚教程网
在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:"宋体";} 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"} |
-
上一个: 常用的CSS缩写语法一些方法小结
相关文章
- css 文字垂直居中实现方法总结 06-05
- css中ie7/ie6按钮文字垂直居中的兼容性解决方法 01-06
- CSS 鼠标点击拖拽效果代码展示 10-31
- CSS使用SVG实现动态分布的圆环发散路径动画教程 10-31
- css3中仿放大镜效果的几种方式原理介绍 10-26
- CSS3切割轮播图的代码展示 10-26