CSS3 过渡是元素从一种样式逐渐改变为另一种的效果。
要实现这一点，必须规定两项内容：
- 规定您希望把效果添加到哪个 CSS 属性上
- 规定效果的时长
多项改变
如需向多个样式添加过渡效果，请添加多个属性，由逗号隔开：
如：div
{
transition: width 2s, height 2s, transform 2s;
-moz-transition: width 2s, height 2s, -moz-transform 2s;
-webkit-transition: width 2s, height 2s, -webkit-transform 2s;
-o-transition: width 2s, height 2s,-o-transform 2s;
}
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
img{
width:160px;
height:260px;
transition:width 2s, height 2s;
-moz-transition:width 2s, height 2s;
-o-transition:width 2s, height 2s;
-webkit-transition:width 2s, height 2s;
}
img:hover{
width:300px;
height:430px;
}
</style>
</head>
<body>
<div>
<img src="20160617113648970cx.jpg" />
</div>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
img{
width:160px;
height:260px;
transition:width 2s, height 2s;
-moz-transition:width 2s, height 2s;
-o-transition:width 2s, height 2s;
-webkit-transition:width 2s, height 2s;
}
img:hover{
width:300px;
height:430px;
}
</style>
</head>
<body>
<div>
<img src="20160617113648970cx.jpg" />
</div>
</body>
</html>
548
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
