标签：背景 content charset asc title read rds 垂直 像素
1 <head> 2 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> 3 <title>2D转换</title> 4 <meta name="keywords" content="关键字列表" /> 5 <meta name="description" content="网页描述" /> 6 <link rel="stylesheet" type="text/css" href="" /> 7 <style type="text/css"> 8 9 /* transform: translate(50px,100px); 不同浏览器*/ 10 /* -ms-transform: translate(50px,100px); IE 9 */ 11 /* -webkit-transform: translate(50px,100px); Safari and Chrome */ 12 /* -o-transform: translate(50px,100px); Opera */ 13 /* -moz-transform: translate(50px,100px); Firefox */ 14 15 .div1{ 16 margin:300px 600px;/*外边距*/ 17 width:100px;/*设置宽*/ 18 height:100px;/*设置高*/ 19 background-color:yellow;/*设置背景颜色*/ 20 box-shadow: 10px 10px 30px 0px #c0c0c0;/*h-shadow v-shadow blur spread color inset阴影水平偏移、垂直偏移、模糊程度,阴影的尺寸，阴影颜色*/ 21 } 22 .div1:hover/*当鼠标经过*/ 23 { 24 transition-duration: 5s;/*过渡时间*/ 25 -webkit-transform: translate(30px,-50px) rotate(360deg) skew(10deg,10deg) scale(2,2);/* translate(50px,100px) 把元素从左侧移动 30 像素，从底端移动 30 像素;旋转360度，值 skew(30deg,20deg) 围绕 X 轴把元素翻转 10 度，围绕 Y 轴翻转 10 度。 定义 2D 缩放转换，改变元素的宽度(填倍数)和高度(填倍数)。*/ 26 27 </style> 28 <script type="text/javascript"></script> 29 </head> 30 <body> 31 <div class="div1"></div> 32 </body> 33 </html>
标签：背景 content charset asc title read rds 垂直 像素
原文地址：http://www.cnblogs.com/91xiaozhu/p/6100069.html
