鼠标滑过图片缩放比例css3代码

分类：css3知识时间：2015-11-01 15:50:39

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>鼠标滑过图片缩放比例css3代码</title>
</head>
<style type="text/css">
.img_scale{width:500px;height:200px;}
img:hover{-webkit-transform:scale(1.1);-moz-transform: scale(1.1);
-ms-transform: scale(1.1);transform:scale(1.1);}
</style>
<body>
<div class="img_scale">
<img src="1.jpg"/>
<p>鼠标滑过图片时放大2.1倍！</p>
<p>-ms-transform: scale(2.1);            //-ms代表ie内核识别码
-moz-transform: scale(2.1);             //-moz代表火狐内核识别码
-webkit-transform: scale(2.1);         //-webkit代表谷歌内核识别码
-o-transform: scale(2.1);             //-o代表欧朋【opera】内核识别码
transform: scale(2.1);               //统一标识语句</p>
</div>
</body>
</html>

除注明外的文章,均为来源:老汤博客,转载请保留本文地址！
原文地址：https://tangjiusheng.com/css3/40.html

关注下头条号后，请私信将免费分享给你一份web前端资料！
立即关注

大家都在看