CSS中存在的兼容问题

最新推荐文章于 2024-03-30 21:23:47 发布

clqxmt

最新推荐文章于 2024-03-30 21:23:47 发布

阅读量103

点赞数

分类专栏： CSS 文章标签： CSS中存在的兼容问题

本文链接：https://blog.csdn.net/weixin_43755513/article/details/97535470

版权

CSS 专栏收录该内容

68 篇文章 0 订阅

订阅专栏

CSS中存在的兼容问题

1.网页中插入图片会出现的问题：
向下撑大三像素
解决方法：（1）将结束标签例如</div>与img在同一排显示（只有IE6支持）
（2）将图片变成块状 display:block
（3）利用图片垂直方向对齐方式 vertical-align:top/middle/bottom
（4）给图片写浮动 float:left/right;
（5）给父元素设置 font-size:0;

如果图片是通过超链接加载的那么在IE浏览器中会出现边框
解决方法：将图片的边框设置为border:0/none;

2.双边距的问题（IE6的兼容问题）
解决方法：给float的元素添加display:inline;

3.百分比问题（IE6的兼容问题）
只有width的值为50%时才会出现
解决方法：给浮动到右边的元素添加clear:right;

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			*{margin: 0; padding: 0;}
			.left{width: 50%; height: 100px; float: left; background: #f00; cursor:wait; _background:#999;*background:#000; background: #00f\9;}
			.right{width: 50%; height: 100px; float: left; background: #ff0; clear: right;}
		</style>
	</head>
	<body>
		<div class="left"></div>
		<div class="right"></div>
	</body>
</html>

4.鼠标指针
cursor：pointer（鼠标变成小手型）

5.表单行高不一致
解决方法：给input写float属性；

6.按钮大小不一致
解决方法：
（1）给按钮单独设置高度
（2）用其他标签代替按钮
（3）给按钮外部嵌套一个其他标签
（4）用背景图片代替

7.透明

opacity:value;
filter:alpha(opacity=value)

过滤器
下划线写法例如：_height(IE6支持)
星号写法例如：*height(IE6 IE7支持)
反斜杠9 例如：height:100px\9;

clqxmt

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CSS中存在的兼容问题

CSS中存在的兼容问题1.网页中插入图片会出现的问题：向下撑大三像素解决方法：（1）将结束标签例如与img在同一排显示（只有IE6支持）（2）将图片变成块状 display:block（3）利用图片垂直方向对齐方式 vertical-align:top/middle/bottom（4）给图片写浮动 float:left/right;（5）给父元素设置 font-size:0;如果...
复制链接

扫一扫

专栏目录