Causes and solutions to the failure of ie9 line-height
在处理浏览器兼容性问题时,你有没有发现在IE9中浏览DIV CSS网页文字字体偏上方,设置文字垂直上下居中line-height样式失效,而其它浏览器包括ie6-ie8均正常,究竟什么原因造成,如何解决与避免在ie9浏览器line-height失效。
一、ie9 line-height失效原因
CSS中使用了中文字体,而中文字体使用汉字。如:
font-family:"微软雅黑"。使用CSS字体font-family样式使用了“宋体”、“黑体”或“微软雅黑”等中文字体以汉字设置于CSS中。
在网页DIV+CSS布局中不可避免使用中文字体如:黑体、宋体、微软雅黑等中文字体,如何正确使用这些中文字体样式呢?接下来我们来了解如何解决使用这些中文字体,又兼容IE9,支持IE9使用汉字字体。
二、解决ie9字体不垂直居中方法
1、将中文字体汉字转换为Unicode编码
“黑体”对应Unicode编码为“\9ED1\4F53”
“宋体”对应Unicode编码为“\5B8B\4F53”
“仿宋”对应Unicode编码为“\4EFF\5B8B”
“微软雅黑”对应Unicode编码为“\5FAE\8F6F\96C5\9ED1”
将汉字转换为Unicode编码的字符,即成功设置相应字体,又兼容IE9浏览器支持垂直居中line-height样式。
实际应用exp:
.div{ font-family:"微软雅黑"}
转换为Unicode编码后
.div{ font-family:"\5FAE\8F6F\96C5\9ED1"}
汉字字体中文字转换为Unicode编码后字体效果相同,不受影响,兼容各大浏览器。
2、将中文字体汉字使用英文名
将CSS+DIV布局中CSS设置中文字体汉字转换对应英文名字体,转换后设置中文字体效果不变,并兼容各大浏览器。
“黑体”对应英文名为“SimHei”
“宋体”对应英文名为“SimSun”
“仿宋”对应英文名为“FangSong”
“微软雅黑”对应英文名为“Microsoft YaHei”
实际应用exp:
.div{ font-family:"微软雅黑"}
转换为英文名后
.div{ font-family:"Microsoft YaHei"}
将div css布局中css字体使用汉字字体转换为英文名的字体,其设置字体效果不变不受影响,并兼容各大浏览器,大家可以放心使用。
The above is the detailed content of Causes and solutions to the failure of ie9 line-height. For more information, please follow other related articles on the PHP Chinese website!

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

AI Hentai Generator
Generate AI Hentai for free.

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics



If you’ve recently started working with GraphQL, or reviewed its pros and cons, you’ve no doubt heard things like “GraphQL doesn’t support caching” or

The Svelte transition API provides a way to animate components when they enter or leave the document, including custom Svelte transitions.

With the recent climb of Bitcoin’s price over 20k $USD, and to it recently breaking 30k, I thought it’s worth taking a deep dive back into creating Ethereum

How much time do you spend designing the content presentation for your websites? When you write a new blog post or create a new page, are you thinking about

The article discusses using CSS for text effects like shadows and gradients, optimizing them for performance, and enhancing user experience. It also lists resources for beginners.(159 characters)

No matter what stage you’re at as a developer, the tasks we complete—whether big or small—make a huge impact in our personal and professional growth.

npm commands run various tasks for you, either as a one-off or a continuously running process for things like starting a server or compiling code.

I'd say "website" fits better than "mobile app" but I like this framing from Max Lynch:
