在 CSS 动画中,可以使用文字透明度来实现某些特效。文字透明度表示文字的透明程度,可以从 0 到 1 的范围内取值。下面是一个简单的例子:
p { opacity: 0.6; transition: opacity 1s; } p:hover { opacity: 1; }
上面代码中,p 标签的 opacity 属性设置为 0.6,表示文字透明度为 0.6。同时,还设置了过渡效果,即在 1 秒钟内透明度从 0.6 过渡到 1。当鼠标移动到 p 标签上时,通过:hover 选择器将透明度设置为 1,文字变得完全不透明。
除了使用过渡效果,还可以使用关键帧动画(keyframes)来实现透明度变化的效果。例如:
@keyframes myanimation { 0% { opacity: 0; } 50% { opacity: 0.5; } 100% { opacity: 1; } } p { animation: myanimation 2s infinite; }
上面代码中,使用了 @keyframes 规则定义了一个名为 myanimation 的动画,设置了从透明度为 0 到透明度为 1 的变化过程,并将该动画应用到了 p 标签上。同时,使用 animation 属性设置了动画的持续时间为 2 秒钟,循环次数为无限次。