用于WebKit的CSS诀窍[译]（2）

滚动与弹出

下一个示例将演示当你把鼠标放到一张图片上事，它会弹出的效果。实现这些只需要使用一个hover样式和一个度数改变。该效果的CSS如下所示。

<style>
 img { -webkit-transform: scale(0.5); }
 img:hover { -webkit-transform: scale(1); }
</style>

<img src="megan.jpg" />

鼠标滑过图片，它就会弹出并变大，如下所示。

截图2.翻转后的图片

将鼠标从图片上挪开，图片又会恢复原状。

截图3.翻转之前的图片

正如你所能看到的那样，你可以使用几行CSS来实现这个效果。