目前最全的浏览器/CSS选择器兼容性总结
2009年2月24日
,Safari 4.0
beta版正式发布,Safari从它的3.2版本开始就已经支持所有的CSS选择器(包括最新的CSS3)。不过为了方便大家的工作,下面提供了最新版
本的CSS选择器浏览器支持情况,其中包括最新的CSS3和Safari 4.0 Beta的支持情况。感谢Estelle Weyl
的总结。
2009年6月30日
,FireFox 3.5发布,类似Safari 3.1及更新的版本 (包括Safari
4 beta),Opera 9.64 (及更新版本) 和 Google Chrome 都支持所有 CSS2.1 和 CSS3
选择器。以下是我对所有浏览器测试后的兼容性统计表,希望对大家有所帮助。
注:
绿色 / √ 表示目前支持。
橙色/ Δ 表示浏览器部分支持当前CSS选择器。
红色/ Χ 表示浏览器完全不支持。
点击上图查看清晰大图
相关文档:
<style type="text/css">
/*
从上往下渐变
*/
body
{
FILTER:progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#003C9F,endColorStr=white);
}
/*
从左上至右下渐变
*/
body
{
background-color:skyblue;
FILTE ......
选择器的分组
意思就是说几个选择器可以同时使用一个声明,但是选择器之间记住一定要用逗号来隔开,这样我们会节省了很多代码
我们举个例子吧!
h1,h2,h2,h3,h5,h6 {
color: red; background:blue;
}
这样所有的h标题标签的字体颜色是红色,背景是蓝色;应该清楚了吧!
css继承性的问题
子元素继承父元素的 ......
css渐变代码4种
一、从上往下渐变
body{
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff,endColorStr=#000000);
}
二、从左上至右下渐变
body{
FILTER: Alpha( style=1,opacity=25,finishOpacity=100,
startX=50,finishX= 100,startY=50,finishY=100);
background-col ......
CSS滤镜的使用方法:filter:filtername(parameters) 即 filter:滤镜名称(参数)
alpha:设置透明层次
blur:创建高速度移动效果,即模糊效果
chroma:制作专用颜色透明
DropShadow:创建对象的固定影子
FlipH:创建水平镜像图片
FlipV:创建垂直镜像图片
glow:加光辉在附近对象的边外
gray:把图片灰度化
inver ......