各种样式介绍

一、特殊样式

cursor: pointer; 鼠标手掌样式

border-radius: 8px; 边框圆角

opacity: 0.8;filter: alpha(opacity=80); 颜色变暗

text-overflow: ellipsis;  超出部分 显示省略号

width: calc(100vw); 浏览器宽度
height: calc(100vh); 浏览器高度

二、功能样式

1、图片颜色变灰：

/*黑白色 */ 

-webkit-filter: grayscale(1);

filter: grayscale(100%);

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

/* 彩色*/ 

-webkit-filter: grayscale(0);

filter: grayscale(0%);

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

2、背景凸起

.con1_cell:hover {

 transition :all 0.5s;

 box-shadow:0px 15px 15px rgba(0,0,0,0.15);

 transform:translate3d(0px,-2px,0px);

}