前言

  将近一个月没更新过博客了，最近在忙一个项目，这个东西随说是简单，奈何甲方志存高远，硬是想让我们把一个子虚乌有的东西吹成已经存在的真东西。文案之类的都行了，页面这东西咱也能做出来，就是甲方的需求模糊不定，想好看还不给素材，哥几个只能硬着头皮肝了。哥们审美不行，只能做做css，只是后端带哥被硬生生逼成了美工。说实话，人家做的图还真的就比我做的漂亮。我还是写写css吧。

开搞

1.想要做一个背景模糊但内容清楚的效果，直接把背景给一个background，用rgba来控制颜色（背景图片）和透明度就行，之后给这个背景的标签一个:hover，里面还可以添加样式，这样背景上的文字或图片不会模糊。

div {
    background: rgba(255, 255, 255, 1);
    box-shadow: 3px 3px 6px 3px rgba(0, 0, 0, .3);      
}

div:hover {
    box-shadow: 10px 10px 5px 5px #999999;
}

2.想要一个鼠标移到图片上,图片等比放大的效果，

div {
    transition: all 0.8s; //缩放速度
}

div:hover {
    transform: scale(1.1);//放大比例
}

3.如果想做一个让谷歌，火狐或IE都适配的东西就要用这些东西

_和- ， ie6可以识别；
-webkit- ，针对safari，chrome浏览器的内核CSS写法
-moz-，针对firefox浏览器的内核CSS写法
-ms-，针对ie内核的CSS写法
-o-，针对Opera内核的CSS写法