css3属性整理
浏览器内核:主流内容主要有Mozilla(熟悉的有Firefox,Flock等浏览器)、WebKit(熟悉的有Safari、Chrome等浏览器)、Opera(Opera浏览器)、Trident(讨厌的IE浏览器)
-moz- 针对Mozilla内核的浏览器
-WebKit- 针对WebKit内核的浏览器
-o- 针对Opera浏览器
CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变)
格式:-moz-linear(类型)-gradient(方向,起点颜色,终点颜色) 颜色最少为俩值方向可以有两个方向 方向可以没有
参数:其共有三个参数,第一个参数表示线性渐变的方向,top是从上到下、left是从左到右,如果定义成left top,那就是从左上角到右下角。第二个和第三个参数分别是起点颜色和终点颜色。你还可以在它们之间插入更多的参数,表示多种颜色的渐变。如图所示:
IE浏览器用滤镜实现颜色渐变:filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,
startColorstr=#1471da, endColorstr=#1C85FB);
-ms-filter:
"progid:DXImageTransform.Microsoft.gradient (GradientType=0,
startColorstr=#1471da, endColorstr=#1C85FB)";}
IE依靠滤镜实现渐变。startColorstr表示起点的颜色,endColorstr表示终点颜色。GradientType表示渐变类型,0为缺省值,表示垂直渐变,1表示水平渐变。
::selection 不解释 自己看效果
::selection {
background: 颜色值;
color:颜色值;
}
::-moz-selection {
background: 颜色值;
color:颜色值;
}
::selection在IE家族中,只有IE9+版本支持,在Firefox中需要加上其前缀“-moz”,查阅相关w3c官方资料,并没有对这个属性的解说资料,只知道这个属性被规纳在CSS的伪类选择器中。
HTML标签建议
html {
font-size: 100%;
overflow-x: hidden;
overflow-y:scroll;
-webkit-tap-highlight-color: transparent;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
height: 100%;
}
图片的缩放在IE7以及IE6下是件很恐怖的事情,将严重影响您的图片质量,欲解决,记得在img标签上加上下面的代码:
img {
-ms-interpolation-mode: bicubic;
}