`
YongJie
  • 浏览: 73728 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

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

    博客分类:
  • CSS
阅读更多

!important是CSS1定义的语法,作用是提高指定样式规则的应用优先权。
    语法格式{ sRule!important },即写在定义的最后面,例如:box{color:red !important;}


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

.mydiv { 
    border:20px  solid #60A179 !important;
    border:20px  solid #00F;

    padding: 11px !important; 
    padding: 9px; 
    padding: 30px;
   width : 300px;
}

在Mozilla中浏览时候,能够理解!important的优先级,因此border显示#60A179的颜色,padding:11px;
在IE中浏览时候,不能够理解!important的优先级,因此显示#00F的颜色,padding:9px;

分享到:
评论

相关推荐

    让IE和火狐同时兼容

    本文将详细介绍如何使网站能够同时在IE和火狐浏览器中正常显示,主要涉及CSS样式调整、布局技巧以及一些特定于浏览器的解决方案。 #### CSS DOCTYPE影响 在不同浏览器中,文档类型声明(DOCTYPE)对于CSS的渲染...

    解决火狐与IE兼容问题

    本文将详细介绍CSS在Firefox和IE下的兼容性问题及其解决方法。 #### 二、兼容性问题及解决方案 ##### 1. DOCTYPE影响CSS处理 不同的文档类型定义(DOCTYPE)会影响到浏览器的渲染模式,从而影响CSS的表现。例如,...

    IE与FF的CSS兼容问题大集合

    本文将详细介绍Internet Explorer(IE)和Firefox(FF)两种浏览器之间常见的CSS兼容性问题及其解决方案。 #### 1. DOCTYPE对CSS的影响 **问题描述**:在不同DOCTYPE声明下,某些CSS属性的表现可能有差异。例如,...

    IE与火狐常见的区别

    ### IE与火狐浏览器常见区别及兼容性解决方案 在网页设计和前端开发领域,了解不同浏览器之间的差异至关重要,尤其在处理Internet Explorer(IE)与Mozilla Firefox(火狐)时,由于两者对某些CSS属性和HTML标签的...

    IE6_0、IE7_0 与FireFox CSS兼容的解决方法(网上收集)

    Mozilla Firefox和IE在解析`margin`属性时存在差异,特别是在涉及`!important`声明时。为了避免这一问题,可以通过指定具体的顺序和使用`!important`来确保在所有浏览器中`margin`的正确应用。 #### 10. 浮动元素的...

    IE与FF的兼容问题

    而IE5和IE6则使用了不同的盒模型,其中宽度和高度仅包括内容区域,不包括内边距和边框。 为了解决这个问题,可以通过设置`!important`来区分对待IE和Firefox: ```css div { margin: 30px !important; margin...

    针对IE67FF的兼容CSS编码 免费下载

    Mozilla/Firefox和IE在BOX模型的处理上存在差异,特别是对于`margin`和`padding`的计算。为了统一布局,可以使用条件CSS或特定的hack,如`div{margin:30px!important;margin:28px;}`,这里的`!important`是为Firefox...

    IE与Firefox的CSS兼容问题

    为了解决这个问题,可以使用`clear: both`属性或设置`overflow: hidden`来创建一个“清除”浮动的效果,确保布局正确。 #### 11. `!important`的过度使用 虽然`!important`可以帮助解决某些样式覆盖问题,但过度...

    div+css兼容所有浏览器的一些注意事项

    8. **盒模型差异的解决方案**:在Mozilla Firefox和IE中,盒模型解释不一致可能导致2px的偏差。通过为Firefox指定`margin`,然后为所有浏览器指定一个较小的`margin`,并确保`!important`在Firefox适用的样式后面,...

    浏览器的兼容

    7. **Box模型差异**:Mozilla Firefox和IE对Box模型的解释存在差异,导致计算元素的实际尺寸时可能出现2px的偏差。使用`!important`关键字和特定顺序的CSS规则可解决此问题。 8. **float标签的闭合**:在包含`float...

    适合初学者的CSS网页布局技巧

    - 不同浏览器对CSS的解析可能存在差异,例如`ul`标签在Mozilla Firefox中默认有`padding`,而在Internet Explorer (IE)中只有`margin`。要进行兼容性调整,可以使用特定的浏览器前缀或技巧,如使用!important声明来...

    CSS完美兼容通用方法

    - **目的**:确保网页在不同浏览器下(例如IE6/IE7/IE8和Firefox)的一致性和美观性。 - **背景**:由于浏览器内核的不同,它们对CSS的支持也有所差异,这就需要我们采用Hack技巧来兼容这些差异。 ##### **1.2 CSS ...

    css浏览器兼容大全

    为了解决这个问题,可以使用额外的容器或者使用Flexbox等现代布局技术。 #### 七、Cursor属性在IE和Firefox中的差异 `cursor: pointer;`属性在IE和Firefox中的表现略有不同。在IE中,这个属性会使光标变为手形,而...

    IE与Firefox的CSS兼容大全

    - **背景图片平铺**:IE使用`background-repeat:repeat-x`和`background-repeat:repeat-y`来控制水平或垂直方向上的平铺,而Firefox支持`background-repeat:repeat-x`和`background-repeat:repeat-y`。 **解决方法*...

    min-height最小高度实现的解决方法,(兼容IE6、IE7、FF、Chrome)

    在早期的网页设计中,尤其是面对需要兼容旧版浏览器如IE6和IE7时,实现最小高度(min-height)的属性遇到了很多问题。min-height属性是CSS的属性之一,用于规定元素的最小高度,但IE6和IE7并不支持这一属性。这使得...

    jsp浏览器的兼容性

    本文档旨在帮助 JSP 开发人员解决浏览器之间的兼容性问题,提出解决方法,涵盖 Firefox、谷歌、百度和 IE6/7/9 浏览器的兼容问题。 1.Div 的高度参数值后加 px 在设置 Div 的高度时,需要在参数值后加上 px,例如 ...

    css兼容性详解

    ### CSS兼容性详解 #### 一、CSS Hack技术 **CSS Hack**是一种针对不同浏览器或...通过以上介绍的方法和技术,开发者可以有效地解决CSS在不同浏览器间的兼容性问题,确保网站在各种环境中都能提供良好的用户体验。

    .clear方法解决网页自适应高度的问题

    这种方法在IE和Mozilla中都能工作,但IE不承认`height:0`,因此` `会产生一定的高度,影响布局。 为了解决这个问题,可以使用以下更复杂的CSS技巧: ```css .HackBox{ border-top:1px solid transparent !...

Global site tag (gtag.js) - Google Analytics