利用CSS动画使文字滑动展示
利用CSS动画使文字滑动展示
思路:两个div嵌套使用,分为外层div,内层div,外层div用来做滑动边框,内层div用来装载滑动展示文字,通过margin,padding属性设置两个div完全重合。
1、外层div设置上下边框,使用animation属性使其边框具有向右滑动显示的效果,鼠标悬浮后停止动画。
2、内层div设置文字溢出隐藏,使用white-space属性设置隐藏方式,鼠标悬浮后使用渐变展示文字。
代码如下:
CSS
.text-border {
position: absolute;
原创
2020-07-15 16:28:25 ·
1450 阅读 ·
0 评论