Gemeinschaft Lernen Tools-Bibliothek Freizeit

Deutsch

Heim > Web-Frontend > HTML-Tutorial > border-radius结合transition的一个小应用（动画）_html/css_WEB-ITnose

border-radius结合transition的一个小应用（动画）_html/css_WEB-ITnose

WBOY

Freigeben： 2016-06-24 11:16:47

Original

1034 Leute haben es durchsucht

<head lang="en"><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 /></head><br /><body><br /><a class="box"></a><br /></body><br /></html>

Nach dem Login kopieren

Verwandte Etiketten：

border-radius结合transition的一个小应用（动画）

Quelle：php.cn

Vorheriger Artikel：在webstorm下使用compass 和 sass_html/css_WEB-ITnose Nächster Artikel：关于网站性能的深入研究_html/css_WEB-ITnose

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Neueste Artikel des Autors