当前位置:  编程技术>WEB前端

用!important解决IE和Mozilla的布局差别

    来源: 互联网  发布时间:2014-09-06

    本文导语:  在设计《网页设计师》页面的时候,有一个问题一直困扰着我,主菜单在IE和其他(Mozilla、Opera等)浏览器里显示的效果偏差2px。截图如下: IE中的效果 Mozilla Firefox中的效果 这是因为IE对盒之间距离的解释的bug造成的(参考onestab的...

在设计《网页设计师》页面的时候,有一个问题一直困扰着我,主菜单在IE和其他(Mozilla、Opera等)浏览器里显示的效果偏差2px。截图如下:

IE中的效果

Mozilla Firefox中的效果

这是因为IE对盒之间距离的解释的bug造成的(参考onestab的" 浮动模型的问题 ")。我一直没有解决这个问题,直到我翻译 " "时,作者的一个技巧提示帮我找到了解决的方法:用!important。

!important是CSS1就定义的语法,作用是提高指定样式规则的应用优先权(参见:W3.org的解释)。语法格式{ sRule!important },即写在定义的最后面,例如:

box{color:red !important;}

最重要的一点是:IE一直都不支持这个语法,而其他的浏览器都支持。因此我们就可以利用这一点来分别给IE和其他浏览器不同的样式定义,例如,我们定义这样一个样式:

.colortest { 
border:20px solid #60A179 !important;
border:20px solid #00F;
padding: 30px;
width : 300px;
} 

在Mozilla中浏览时候,能够理解!important的优先级,因此显示#60A179的颜色:

在IE中浏览时候,不能够理解!important的优先级,因此显示#00F的颜色:

可以看到,利用!important,我们可以针对IE和非IE浏览器设置不同的样式,只要在非IE浏览器样式的后面加上!important。因此,上面提到的我的主页2px的显示差别也轻松解决:

PADDING-TOP: 11px !important;
PADDING-TOP: 9px;

!important必定成为CSS布局的利器,请记住和掌握它吧:)


    
 
 
 
本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • import javax.mail.* 跟import javax.mail.internet.MimeMessage;import javax.mail.internet.InternetAddress;有啥区别,详情请点击看里
  • 导入包的问题?概述:import javaclass.*;和import javaclass.MainWindow;的区别
  • 下载了rowset.jar,放在什么目录里,JB5能IMPORT它就象IMPORT其他的包那样
  • 为什么import other.*;不包括import other.oth;????????
  • 为什么我能import aa.bb.cc;却不能import aa.bb.*;
  • 关于import test.*和import test.A的问题
  • 请问用Color类要import什么库
  • 如果我要用openFileDialog我应该import哪些?
  • 关于import的疑惑
  • package与import的区别
  • 操作系统 iis7站长之家
  • import netscape.javascript.*;的问题
  • <%@ page language="JAVA" import="Java.sql.*"%> 的条件
  • import corejava.*;
  • import 语句该如何用?
  • 求助:import javax.servlet.*;
  • 解决ie动态修改link样式,import css不刷新的问题
  • 关于java的import的问题
  • Jbuilder中怎么import包怎么丢掉了com.borland???奇怪!
  • import 的问题


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3