css常用效果总结,css常用效果总结(示例代码)

1.让网站色调快速变灰，用的是css的filter功能。

html {

filter: grayscale(100%);//IE浏览器

-webkit-filter: grayscale(100%);//谷歌浏览器

-moz-filter: grayscale(100%);//火狐

-ms-filter: grayscale(100%);

-o-filter: grayscale(100%);

filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);

-webkit-filter: grayscale(1);//谷歌浏览器

}

2.模糊滤镜效果

body,htmll{-webkit-filter: blur(1px);

-moz-filter: blur(1px);

-o-filter: blur(1px);

-ms-filter: blur(1px);

filter: blur(1px);}

3.表单中文字两端对齐

.test {

width: 68px;

padding: 0;

margin: 0;

height: 25px;

text-align:justify;

text-justify:distribute-all-lines;/*ie6-8*/

text-align-last:justify;/* ie9*/

-moz-text-align-last:justify;/*ff*/

-webkit-text-align-last:justify;/*chrome 20+*/

}

@media screen and (-webkit-min-device-pixel-ratio:0){/* chrome*/

.test1:after{

content:".";

display: inline-block;

width:100%;

overflow:hidden;

height:0;

}

}