在 CSS 中设置淡入淡出

在 CSS 中设置淡入淡出

本文将介绍 CSS 中设置过渡的方法。我们将学习在 opacity、height 和 visibility 上使用过渡来在悬停和悬停时提供淡入和淡出效果。 在 CSS 中使用 opacity 和 visibility 属性以及 transition 属性设置过渡 我们不能在 CSS 的 display 属性中使用 transition 属性。例如,我们不能使用 CSS transition 属性在悬停(鼠标进入)后将 display : none 更改为 display : block,反之亦然。因此,我们可以使用 opacity 和 visibility 属性以及过渡来为项目提供淡入和淡出效果。Transition 具有某些属性,例如 transition-property、transition-duration、transition-timing-function 和 transition-delay。我们也可以使用 transition 速记属性作为 transition : opacity 2s linear 1s。这里 opacity 表示 transition-property,2s 表示 transition-duration,linear 表示 transition-timing-function,而 1s 表示 transition-delay。我们可以使用悬停来试验 transition。

Tags

CSS Transition CSS Background CSS Content CSS Opacity CSS Color CSS Alignment CSS Button CSS Image CSS Property CSS Animation CSS Dropdown CSS Hover CSS Inline CSS Font CSS Cursor CSS Border CSS Space CSS Selector CSS Child CSS Class CSS Scroll CSS Padding CSS Margin CSS Hyperlink CSS Checkbox CSS Onclick CSS Cell Padding CSS Cell Spacing HTML RGBA

最热门文章

最近更新的文章