#box{width:800px;border:5px#333333solid;}#left{width:360px;ba"> #box{width:800px;border:5px#333333solid;}#left{width:360px;ba" />
css中一些兼容性问题和技巧

css中一些兼容性问题和技巧

ID:6647650

大小:363.00 KB

页数:8页

时间:2018-01-21

css中一些兼容性问题和技巧_第1页
css中一些兼容性问题和技巧_第2页
css中一些兼容性问题和技巧_第3页
css中一些兼容性问题和技巧_第4页
css中一些兼容性问题和技巧_第5页
资源描述:

《css中一些兼容性问题和技巧》由会员上传分享,免费在线阅读,更多相关内容在学术论文-天天文库

1、一、设置float:left时父元素height不能自适应的兼容问题代码:#box{width:800px;border:5px#333333solid;}#left{width:360px;background:#FF0000;height:250px;float:left;}#right{float:left;width:360px;background:#0000FF;height:250px;}<

2、divid="left">

(1)在IE6和IE7中显示如下:(2)在IE8和IE9中显示如下:(3)在firefox和opera中显示如下:解决办法:在父元素中添加overflow:hidden代码如下:#box{width:800px;border:5px#333333solid;overflow;hidden}#left{width:360px;background:#FF0

3、000;height:250px;float:left;}#right{float:left;width:360px;background:#0000FF;height:250px;}修改后:IE、firefox、opera中显示如下:一、当同时设置float:left和margin时IE6会产生双倍margin值代码如下:#box{width:800px;border:5px#333333solid;overflow:hidden}#lef

4、t{width:360px;background:#FF0000;height:250px;float:left;margin:0px20px;}#right{float:left;width:360px;background:#0000FF;height:250px;margin:0px20px;}

在IE6中显示如下:在IE7

5、、IE8、IE9、firefox、opera中显示如图:解决方法:添加display:inline修改后:IE、firefox、opera中显示如下:一、margin不能撑开height代码如下:#box{background-color:#eee;width:300px;}#inbox{margin-top:20px;margin-bottom:20px;text-align:center}

6、="inbox">对象中的内容(1)IE6和IE7能够撑开,如图:(2)IE8、IE9、firefox、和opera不能撑开。如图:解决办法一:在#inbox对象上下各加2个空的div对象CSS代码:.1{height:0px;overflow:hidden;}代码如下:#box{background-color:#eee;width:300px;}#inbox{margin-top:20px;margin-bottom

7、:20px;text-align:center;}.hidden{height:0px;overflow:hidden}p对象中的内容修改后:IE、firefox、opera显示如图:解决方法二:为#box加上border属性代码如下:#b

8、ox{background-color:#eee;width:300px;border:1px#666666solid}#inbox{margin-top:20px;margin-bottom:20px;text-align:center;}p对象中的内容修改后:IE、firefox、opera显示如图:一、margin-top失效代

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。