search

Home  >  Article  >  Web Front-end  >  CSS兼容性_html/css_WEB-ITnose

CSS兼容性_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-21 08:59:531118browse

在开发中难免会遇到CSS的兼容问题,特别是IE这个臭蛋蛋,今天正好有时间,就整理一下平时遇到的CSS兼容问题以及解决方案.

文档类型的声明

  • 在IE6中如果没有书写这个文档说明,就会进入怪异模式解析现象.

解决方法:

  • 在文件开头写此说明

横向双倍外边距

  • 在IE6中块元素浮动后，会出现横向双倍margin现象

解决方法:

  • 在float标签的样式控制中加入display：inline

IE6最小height值19px

  • 在IE6中即使设置 height:10px,在IE6中也会是19px

解决方法

  • 在CSS中加入overflow:hidden

img外部的border

  • 在IE6,7中,img外部有a标签，即img标签有链接时,会产生边框.

解决方法

  • 在CSS样式中使用border:none

IE6中的透明度设置

  • 设置透明度时,常常使用rgba()和 opacity 来设置,但是,臭蛋蛋不支持.

解决方法

  • 在CSS样式中添加 filter:alpha(opacity=50) ,但是此时 opacity的值是1-100的值.

:hover的兼容

  • 在IE6中:hover,:link,:visited ,:active 只能给 a标签 使用.并且不支持其他伪类.

解决方法

  • 增加 zoom:1的属性

<style>*{    margin: 0;padding: 0;}a:hover em{    color: blue;}a:hover{    zoom: 1;   增加  触发 IE6 下就好用了}</style></head><body>    <a href=""> <span>hello <em>颜色</em> world</span></a></body>

关于CSS Hack

  • _width--只有IE6支持

  • *width --IE6,7 支持 ,常用

  • +width --IE6,7 支持

Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：初学HTML 有个简单的小问题帮忙看一下_html/css_WEB-ITnoseNext article：HTML的框架_html/css_WEB-ITnose

Related articles

See more