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;
}

posted on 2016-03-29 11:19  云鹏@道  阅读(229)  评论(0编辑  收藏  举报

导航