课程: Advanced Responsive Layouts with CSS Flexbox

今天就学习课程吧！

今天就开通帐号，24,700 门业界名师课程任您挑！

Animating content

Animating content - CSS教程

课程: Advanced Responsive Layouts with CSS Flexbox

开始一个月试用 购买团队方案

Animating content

“

- CSS 3 has introduced a lot of cool new features to CSS that were previously only available through JavaScript and one of these features is transitions. A CSS transition allows us to tell the browser to animate over time a transition between one state and another state in the browser. So for example, if you look at this sidebar menu we have here right now, when I hover my mouse over one of these menu items you'll see a transition happen. What's changing is the background color, the font color, and the position of the text. We are adding a padding to the text and all of this is being transitioned over a period of time within the browser. So the browser sees that the default state has no background color, black text, and no padding. And the hover state has a padding on the lefthand side, a black background color, and a white font and then we tell the browser over a period of .3 seconds we want the transition to happen and the browser will animate everything for us. So we get this…

内容