网页css样式滚动字幕
生活随笔
收集整理的這篇文章主要介紹了
网页css样式滚动字幕
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
一、代碼
.verticalText{position: absolute;z-index:10;top: 0; left: 0;bottom:0;right:0;background: -webkit-linear-gradient(top,#f6f8fa 10%, rgba(0,0,0,0) 30%,rgba(0,0,0,0) 80%,#f6f8fa 95%); Safari 5.1 - 6.0background: -o-linear-gradient(top,#f6f8fa 10%, rgba(0,0,0,0) 30%,rgba(0,0,0,0) 80%,#f6f8fa 95%); Opera 11.1 - 12.0background: -moz-linear-gradient(top,#f6f8fa 10%, rgba(0,0,0,0) 30%,rgba(0,0,0,0) 80%,#f6f8fa 95%); Firefox 3.6 - 15background: linear-gradient(top, #f6f8fa 10%,rgba(0,0,0,0) 30%,rgba(0,0,0,0) 80%,#f6f8fa 95%); 標準的語法 }.wordAni {font-size: 14px;display: inline-block;animation: wordsLoop 30s linear infinite; } <div class="pt90 pb230 container"><ul class="row about"><liclass="d-flex jusitify-content-center align-items-center col-lg-4 col-12 overhidden"><div class="w100 h100 introduce"><div class="w100 h100 borderBox"><div class="introduceText"></div><div class="text overhidden textBox"><div class="verticalText"></div><div class="wordAni" id="compan1"></div></div></div></div></li>總結
以上是生活随笔為你收集整理的网页css样式滚动字幕的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 数据时代的大数据技术,主要包括哪些内容?
- 下一篇: matplotlib.pyplot 库(