今天很其怪用transition scale來改變容器大小沒問題
但對圖片就沒有效，上網找了了解決方法
img{
/* Webkit for Chrome and Safari */
-webkit-transform: scale(1, 1); /* This is the scale for the normal size of the image.*/
-webkit-transition-duration: 500ms;
-webkit-transition-timing-function: ease-out;
/* Webkit for Mozila Firefox */
-moz-transform: scale(1, 1);
-moz-transition-duration: 500ms;
-moz-transition-timing-function: ease-out;
/* Webkit for IE( Version: 11, 10 ) */
-ms-transform: scale(1, 1);
-ms-transition-duration: 500ms;
-ms-transition-timing-function: ease-out;
}
img:hover{
/* Webkit for Chrome and Safari */
-webkit-transform: scale(1.2, 1.2); // This is the enlarged size scale of the image.
-webkit-transition-duration: 500ms;
-webkit-transition-timing-function: ease-out;
/* Webkit for Mozila Firefox */
-moz-transform: scale(1.2, 1.2);
-moz-transition-duration: 500ms;
-moz-transition-timing-function: ease-out;
/* Webkit for IE( Version: 11, 10 ) */
-ms-transform: scale(1.20, 1.20);
-ms-transition-duration: 500ms;
-ms-transition-timing-function: ease-out;
}
延伸閱讀：https://drujoopress.wordpress.com/2014/01/31/zoom-effect-using-css3-transition-scale/
