IE6常见CSS解析Bug和hack
第一:图片间隙
a:div中的图片间隙;
描述:在div中插入图片时,图片会将div下方撑大3像素
hack1:将<div>和<img>写在一行
hack2:将<img>转为块元素,给<img>添加声明:display:block;
hack3:给<div>设置:overflow:hidden
b:dt,li中图片间隙
hack:同a中的hack2,hack3方法
第二:默认高度
描述:在IE6及以下版本中,部分块元素具有默认高度(低于18px高度)
hack1:给元素添加声明:font-size:0;
hack2:给元素添加声明:overflow:hidden;
第三:双倍浮动(双倍边距)
描述:当IE6及更低版本浏览器在解析浮动元素时,会错误的把浮向边边界加倍显示
hack:给浮动元素添加声明:display:inline;
第四:表单元素行高不一致(几乎没个浏览器都有)
描述:表单元素行高对齐方式不一致
hack:给表单元素添加声明:float:left;
第五:按钮元素默认大小不一
描述:个浏览器中按钮元素大小不一致
hack1:统一大小(用其他标签模拟按钮)
hack2:input外边套一个标签,在这个标签上边写按钮的样式,把input标签的边框和背景样式去掉
hack3:将按钮样式的图片直接设置为背景图片
第六:百分比Bug
描述:IE浏览器在解析百分比时,会按四舍五入的方式计算从而导致50%+50%>100%的情况
hack:给右面的浮动元素添加声明:clear:right;或者clear:left;或者clear:both;
第七:鼠标指针Bug
描述:cursor属性的hand属性值只在IE6及以下版本浏览器识别,其他浏览器不识别该声明,cursor的pointer属性值IE6以上版本及其他浏览器都识别
hack:统一鼠标手型形状应将cursor:hand;加上,默认的为cursor:pointer;
第八:透明属性
hack:IE浏览器(8以下):filter:alpha(opacity=value);(取值范围1到100),其他浏览器写法:opacity:value;(value的取值范围0.1到1)
第九:过滤器
1:下划线过滤器
描述:在一个属性前加了下划线后,在IE6及以下版本能识别这个规则,别的浏览器则不识别而忽略这个属性
2:important关键字过滤器
描述:表示所附加的声明具有最高优先级的意思,IE6及以下版本不识别
IE6常见CSS解析Bug和hack的更多相关文章
- IE6常见CSS解析Bug及hack
IE6常见CSS兼容问题总结 1)图片间隙 A)div中的图片间隙(该bug出现在IE6及更低版本中) 描述:在div中插入图片时,图片会将div下方撑大三像素. hack1:将</div> ...
- IE6对CSS支持Bug收集
1.IE6双外边距 在IE6下,如果对元素设置了浮动,同时又设置了margin-left或者margin-right,margin值会加倍. 例如,设置margin-left:10px在IE6下会显示 ...
- jquery博客收集的IE6中CSS常见BUG全集及解决方案
今天的样式调的纠结,一会这边一会那么把jquery博客折腾的头大,浏览器兼容性.晚上闲着收集一些常见IE6中的BUG 3像素问题及解决办法 当使用float浮动容器后,在IE6下会产生3px的空隙,有 ...
- IE6中CSS常见BUG全集及解决方案——摘自网友
IE6中CSS常见BUG全集及解决方案 IE6双倍边距bug 当页面内有多个连续浮动时,如本页的图标列表是采用左浮动,此时设置li的左侧margin值时,在最左侧呈现双倍情况.如外边距设置为10px, ...
- 前端之旅HTML与CSS篇之IE6常见BUG
1.IE6怪异解析之padding与border算入宽高原因:未加文档声明造成非盒模型解析解决方法:加入文档声明<!doctype html> 2.IE6在块元素.左右浮动.设定marin ...
- IE6常见bug整理
By Diaoyude | 发布时间: 09-08 09:47 | Hits:1,253 | Post in: WEB前端 , Div-Css 针对IE6常见的一些ie6bug,ie6png,E6 ...
- HTML-IE6兼容性问题及IE6常见BUG详细汇总
点评:IE6的兼容性问题一直都是前端工程师的恶梦,为了早早脱离这种困境,本文整理了一些相关兼容性的知识,感兴趣的朋友可以参考下哈,希望可以帮助到你- 1.终极方法:条件注释 <!--[if lt ...
- IE6兼容性问题及IE6常见bug详细汇总
转载地址:http://www.jb51.net/css/76894.html 1.IE6怪异解析之padding与border算入宽高 原因:未加文档声明造成非盒模型解析 解决方法:加入文档声明&l ...
- IE6兼容性问题及IE6常见bug详细汇总---转载
1.IE6怪异解析之padding与border算入宽高 原因:未加文档声明造成非盒模型解析 解决方法:加入文档声明<!doctype html> 2.IE6在块元素.左右浮动.设定mar ...
随机推荐
- C++模板之隐式实例化、显示实例化、隐式调用、显示调用和模板特化详解
模板的实例化指函数模板(类模板)生成模板函数(模板类)的过程.对于函数模板而言,模板实例化之后,会生成一个真正的函数.而类模板经过实例化之后,只是完成了类的定义,模板类的成员函数需要到调用时才会被初始 ...
- SQL 系统表
http://www.cnblogs.com/asdcer/archive/2007/05/14/746377.aspx
- PHP实现人脸识别技术
这次人脸识别技术,是实现在微信端的,也就是说利用公众微信平台,调用第三的API来实现人脸识别这项技术的. 实现的思路: 首先呢,将收集的照片,建立一个照片库,然后利用在微信平台发送的照片,去到照片库进 ...
- FLINK源代码调试方式
此文已由作者岳猛授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 第一种,直接通过IDEA WINDOWS调试 前提是Flink所有依赖已经导入,直接在Test中打断点,然后直 ...
- E20180527-hm
percolate vi. 渗透; 滤; 渗入; (思想等) 渗透
- oop的三大特点
1.封装性:也称为信息隐藏,就是将一个类的使用和实现分开,只保留部分接口和方法与外部联系,或者说只公开了一些供开发人员使用的方法.于是开发人员只 需要关注这个类如何使用,而不用去关心其具体的实现过程, ...
- API网络接口
1.天气 文章:http://segmentfault.com/a/1190000002607883 地址:http://api.lib360.net/open/weather.json?city=北 ...
- studio 配置 opencv3.1
环境 win10 android studio2.0 OpenCV-3.1.0-android-sdk android-ndk-r10e-windows-x86_64 jdk-8u102-window ...
- Unity5.0 EventSystem事件系统的详细说明
http://www.manew.com/blog-56596-2917.html?_dsign=53b25d5d unity5.0开发了新的UI系统UGUI,附带的事件系统EventSystem不仅 ...
- 详解什么是redis
企业中redis是必备的性能优化中间件,也是常见面试题,首先Redis是由意大利人Salvatore Sanfilippo(网名:antirez)开发的一款内存高速缓存数据库.Redis全称为:Rem ...