CSS3 Media Queries和CSS3 transition属性下的动画效果实例页面

展示

代码

CSS代码：

.demo img { 
    width: 200px;
    -webkit-transition: width 2s ease;
    -moz-transition: width 2s ease;
    -o-transition: width 2s ease;
    -ms-transition: width 2s ease;
    transition: width 2s ease;
}
@media only screen and (max-width: 1024px) {
    /*浏览器宽度小于1024时，图片宽度150px*/
    .demo img {
        width: 150px;
    }
}