CSS實現圖片放大縮小的幾種方法

NO IMAGE
1 Star2 Stars3 Stars4 Stars5 Stars 給文章打分!
Loading...
  • 常用使用img標籤,制定width或者height的任意一個,圖片會自動等比例縮小
<div>
<img src="http://avatar.csdn.net/8/5/D/1_u012941315.jpg"/>
</div>
<!-- CSS-->
<style>
img {
width: 100px;//重置大小,最終圖片大小確定
}
</style>
  • 使用CSS3新屬性,transform的scale
    • 大於1: 放大
    • 小於1: 縮小
<style>
img{
transform:scale(2);//設定縮放比例
-ms-transform:scale(2);
-webkit-transform:scale(2);
-o-transform:scale(2);
-moz-transform:scale(2);
}
</style>

相關文章

程式語言 最新文章