代码如下
<div class="search">
<div class="txt_change">
<em>域名</em>
<div class="txt_change_bottom">
<em>2022云栖大会</em>
<em>金秋云创季</em>
</div>
</div>
<i></i>
</div>
.search {
width: 123px;
height: 100%;
padding: 0 13px;
background-color: red;
}
.txt_change {
width: 92px;
height: 100%;
display: inline-block;
position: relative;
}
.txt_change_bottom {
position: absolute;
}
.txt_change_bottom em {
z-index: 1;
display: block;
height: 64px;
width: 92px;
background-color: white;
animation: move 4s steps(3) infinite;
}
@keyframes move {
0% {
}
100% {
transform: translateY(-192px);
}
}
.search i::after {
content: '';
font-family: 'icomoon';
}