一、代码
.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.0
background: -o-linear-gradient(top,#f6f8fa 10%, rgba(0,0,0,0) 30%,rgba(0,0,0,0) 80%,#f6f8fa 95%); Opera 11.1 - 12.0
background: -moz-linear-gradient(top,#f6f8fa 10%, rgba(0,0,0,0) 30%,rgba(0,0,0,0) 80%,#f6f8fa 95%); Firefox 3.6 - 15
background: 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">
<li
class="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>