Heim  >  Artikel  >  Web-Frontend  >  font和line-height之CSS代码书写顺序不同,导致显示效果不一样_经验交流

font和line-height之CSS代码书写顺序不同,导致显示效果不一样_经验交流

WBOY
WBOYOriginal
2016-05-16 12:07:481851Durchsuche

无意中发现,针对同一HTML标记,在CSS中同时应用了font和line-height属性时,就得小心了,这二者的书写顺序不一样,会导致显示效果不同。
即:
>>> 如果先写font,再写line-height,显示效果正常
>>> 如果先写line-height,再写font,则line-height定义的效果会丢失,在IE、Firefox、Opera下都出现这种BUG

具体效果请看以下代码:

h1:


IECN.Net - 专注Web技术,体验开发乐趣!


IECN.Net - 专注Web技术,体验开发乐趣!



div:


IECN.Net - 专注Web技术,体验开发乐趣!

IECN.Net - 专注Web技术,体验开发乐趣!



原文:http://www.cnlei.org/blog/article.asp?id=343

注:看了枫岩的留言,去查了下CSS帮助文档

引用
对font的定义参数必须按照如下的排列顺序。每个参数仅允许有一个值。忽略的将使用其参数对应的独立属性的默认值:
font : font-style || font-variant || font-weight || font-size || line-height || font-family 
例子:p { font: italic small-caps 600 12pts/18pts 宋体; } 

作者:ztu http://www.dnew.cn/post/217.htm#topreply
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn