Home  >  Article  >  Web Front-end  >  border-radius结合transition的一个小应用(动画)

border-radius结合transition的一个小应用(动画)

WBOY
WBOYOriginal
2016-05-27 08:46:561662browse
<br>    <meta charset="UTF-8"><br>    <title></title><br>    <style type="text/css"><br />        .box{<br />            display:block;<br />            height:350px;<br />            width:250px;<br />            background:#ddd;<br />            cursor:pointer;<br />            -webkit-transition: 0.4s;<br />            -moz-transition: 0.4s;<br />            -ms-transition: 0.4s;<br />            -o-transition: 0.4s;<br />            transition: 0.4s;<br />        }<br />        .box:hover{<br />            border-top-right-radius:180px 120px;background: rgba(246,246,247,0.9);<br />        }<br />    </style><br><br><br><a class="box"></a><br><br>
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article:【前端开发】综述Next article:gradient杂谈