css图片悬停特效,使用CSS3实现图片悬停放大的特效

图片浏览器相信大家已经见过不少，Windows用缩略图模式查看图片从某种意义上也算是一款图片浏览器。这类应用重点往往在于功能，界面比较单调，鼠标移上时没有任何效果。点击的时候背景高亮显示，代表图片被选中，期间没有任何过渡，对用户缺乏吸引力。

本教程我们就来学习如何用css3来美化这类应用。先来看看效果，默认情况下图片变暗，鼠标移到图片上时，图片会变亮(实际上是恢复初始状态)，并且在图片周围显示一个模糊的光圈，整个过程不是突变，而是缓动。跟直接出现一个高亮背景相比，效果是不是高大上了不少？

我们把要展示的图片都放在html文件所在目录下的images文件夹，然后就开始构建基础的html代码。

为了更好地区分图片和背景，我们给img加一个1像素的边框，颜色为白色，跟背景的黑色拉开对比。

这里我们就对class=img的元素内部的img元素设置这个样式。

.imgimg{

border:1px solid #fff;

}

感觉不是很好看，我们平时看到