css过渡+3D效果的简单实现
- >
- <html>
- <head>
- <title>guodutitle>
- <meta charset="utf-8">
- <style type="text/css">
- #wp{
- border: 1px solid red;
- width: 500px;
- height: 500px;
- background-color: pink;
- color: lime;
- transition-property: background color;
- transition-duration: 5s;
- transition-timing-function: cubic-bezier(0 0 0.2 0.2);
- transition-delay: 1s;
- transform: perspective(600px);
- }
- #wp:hover{
- background: red;
- color: white;
- width: 800px;
- transform-origin: (150px 100px 120px);
- transform: skewY(80deg) rotate(45deg) translate(50%) ;
- }
- style>
- head>
- <body>
- <div id="wp"><h1>南海是中国的，菲律宾也是中国的h1>div>
- body>
- html>
以上这篇css过渡+3D效果的简单实现就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持潘少俊衡。
原文地址：http://www.cnblogs.com/yzybc/p/5666719.html
版权声明
本文仅代表作者观点，不代表本站立场。
本文系作者授权发表，未经许可，不得转载。
本文地址：/web/CSS/77726.html
