简单的HTML和CSS实现的滚动字幕代码 - 小武站
管理员 系统 关注 创始人 10级
发表于NEW版块

简单的HTML和CSS实现的滚动字幕代码

以下是一个简单的HTML和CSS实现的滚动字幕代码:


```html

<!DOCTYPE html>

<html>

<head>

 <title>滚动字幕</title>

 <style>

  .marquee {

   width: 100%;

   overflow: hidden;

   white-space: nowrap;

  }

  .marquee span {

   display: inline-block;

   padding-left: 100%;

   animation: marquee 5s linear infinite;

  }

  @keyframes marquee {

   0% { transform: translateX(0); }

   100% { transform: translateX(-100%); }

  }

 </style>

</head>

<body>

 <div class="marquee">

  <span>这是一个滚动字幕</span>

 </div>

</body>

</html>

```


将上述代码保存为一个HTML文件,然后在浏览器中打开即可看到滚动字幕效果。你可以根据需要修改样式和内容。

福建,厦门,集美区

已有0次打赏
(1) 分享
分享

请保存二维码或复制链接进行分享

取消