<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> <style> #d{ width:200px; height:200px; background:blue; overflow:hidden; } #dd { width:100px; height:100px; background:red; /*css过渡，给哪个属性加过度*/ transition:transform 2s; margin:50px; } #dd:hover { /*css2D转换，让元素放大或减少多少倍，第一个值是宽度，第二个值是高度*/ transform: scale(3,3); } </style> </head> <body> <p><b>注意：</b>该实例无法在 Internet Explorer 9 及更早 IE 版本上工作。</p> <div id="d"> <div id="dd"> </div> </div> <p>鼠标移动到 div 元素上，查看过渡效果。</p> </body> </html>