你的位置:首页 > 软件开发 > 网页设计 > 【CSS】过渡、动画和变换

【CSS】过渡、动画和变换

发布时间:2016-07-20 22:00:03
1. 使用过渡过渡效果一般是由浏览器直接改变元素的CSS属性实现的。例如,如果使用:hover选择器,一旦用户将鼠标悬停在元素之上,浏览器就会应用跟选择器关联的属性。<!DOCTYPE html><html lang="en">< ...

【CSS】过渡、动画和变换

1. 使用过渡

过渡效果一般是由浏览器直接改变元素的CSS属性实现的。例如,如果使用:hover选择器,一旦用户将鼠标悬停在元素之上,浏览器就会应用跟选择器关联的属性。

<!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8">  <title>Example</title>  <style type="text/css">    p { padding: 5px; border: medium double black; background-color: lightgray; font-family: sans-serif;}    #banana { font-size: large; border: medium solid green;}    #banana:hover { font-size: x-large; border: medium solid white; background-color: #1fa6e6; color: white; padding: 4px;}  </style></head><body>    <p>      There are lots of different kinds of fruit - there are over 500 varieties of <span id="banana">banana</span> alone.      By the time we add the countless types of apples, oranges, and other well-know fruit, we are faced with thousands of choices.    </p></div></body></html>

原标题:【CSS】过渡、动画和变换

关键词:CSS

CSS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。