話不多說，直接上執行個體代碼
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>moveUp</title><style> ul,li{ margin:0; padding:0; } li{ list-style:none; } .container{ display:inline-block; background:#efefef; padding:10px; border:1px solid #ccc; font-family:"Microsoft YaHei"; } .container .li-box{ height:28px; overflow:hidden; } .container ul{ position:relative; animation: moveUp 8s 0.6s infinite; -webkit-animation: moveUp 8s 0.6s infinite; } @keyframes moveUp { 0% {top:0px;} 18% {top:0px;} 20% {top:-28px;} 38% {top:-28px;} 40% {top:-56px;} 58% {top:-56px;} 60% {top:-84px;} 78% {top:-84px;} 80% {top:-112px;} 98% {top:-112px;} }</p> <p> @-webkit-keyframes moveUp /*Safari and Chrome*/ { 0% {top:0px;} 18% {top:0px;} 20% {top:-28px;} 38% {top:-28px;} 40% {top:-56px;} 58% {top:-56px;} 60% {top:-84px;} 78% {top:-84px;} 80% {top:-112px;} 98% {top:-112px;} } .container li{ line-height:1.8; color:#666; }</style></head><body><p> <p> <ul> <li>飛鯊勇士張超：曾駕殲-8戰機逼退外軍偵察機</li> <li>台媒炒作大陸軍機飛臨台海 台軍方：全程監控</li> <li>菲總統對華為何晴轉陰：先期待“訪華”後欲“清算中國”</li> <li>外媒稱韓國醉心中等強國地位 屢次在關涉中國時遇挫</li> <li>伊朗官方回應日本駐伊大使被扣押：沒有的事兒</li> <li>菲總統對華為何晴轉陰：先期待“訪華”後欲“清算中國”</li> </ul> </p></p></body></html>
以上就是本文的全部內容，希望對大家的學習有所協助，更多相關內容請關注topic.alibabacloud.com！
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
