各个浏览器兼容性问题积累

1、圆角边框

实例

向 div 元素添加圆角边框：

div
{
border:2px solid;
border-radius:25px;
}

亲自试一试

页面底部有更多实例。

浏览器支持

IE9+、Firefox 4+、Chrome、Safari 5+ 以及 Opera 支持 border-radius 属性。

2、设置背景图片的大小。

指定背景大小，以象素或百分比显示。当指定为百分比时，大小会由所在区域的宽度、高度，以及background-origin的位置决定。还可以通过cover和contain来对图片进行伸缩。

引擎类型	Gecko	Webkit	Presto
Background-size		-webkit-background-size	-o-background-size

兼容性：

类型	Internet Explorer	Firefox	Chrome	Opera	Safari
版本	(×)IE6	(×)Firefox 2.0	(√)Chrome 1.0.x	(√)Opera 9.63	(√)Safari 3.1
	(×)IE7	(×)Firefox 3.0	(√)Chrome 2.0.x		(√)Safari 4
	(×)IE8	(×)Firefox 3.5

3.CSS透明度的问题

我们在写网页处理透明度问题时，

1、我们会考虑到用ps调透明度，保存为png格式。

2、不用图片时，我们可以用css样式，

用下面的样式表定义你的层

.alpha { filter: Alpha(Opacity=50, FinishOpacity=50, Style=0, StartX=0, StartY=0, FinishX=100, FinishY=100｝

解释：

Opacity=开始的不透明度(100的话就不透明了)

FinishOpacity=结束的不透明度(100的话就不透明了)

Style=样式，从0开始，1.2.3....有均匀透明啊，放射形状透明啊...

StartX=开始透明的X坐标，基本上为图片、层的左上角（0）

StartY= 开始透明的Y坐标，基本上也为图片、层的左上角（0）

FinishX=结束透明的X坐标，基本上也图片、层的右下（图片、层的宽度）

FinishY=结束透明的Y坐标，基本上也为图片、层的右下角（图片、层的高度）

当然如果只写opacity：0.7，兼容火狐和谷歌，在IE里就无效果了，此时可以这样写：

	IE：filter:alpha(opacity=60)     FireFox：-moz-opacity: 0.6      Chrome：opacity: 0.6	

	.test{
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}这样就可以都兼容了。