.tag-center
display flex
align-items center
position absolute
width 500px
height 50px
line-height 50px
text-align center
left 40%
top 120px
border-radius 20px
padding-left 20px
color #fff
transition all 1s ease
background linear-gradient(90deg, #781423 0%, #17347D 97.73%)
background-size 100%
overflow hidden
pointer-events auto
cursor pointer
.el-icon-close
display inline-block
.tag-aside
display inline-block
vertical-align center
width 400px
overflow hidden
.tag-content
display inline-block
white-space nowrap
animation 10s div linear infinite normal
@keyframes div
0%
transform translateX(0px)
100%
transform translateX(-254px)
<div class="tag-center" v-if="showDown">
<i class="el-icon-close" style="margin-right:20px" @click="clickShowFalse"></i>
<div class="tag-aside">
<div class="tag-content">
该浏览器不支持语音播放,请更换稳定版本的浏览器
</div>
</div>
</div>
动画滚动实现从右到左滚动
最新推荐文章于 2023-03-14 15:21:39 发布