HTML5是否支持<marquee>标签？

Question

marquee元素在Html 5中被支持吗？如果不支持，我们如何通过Css 3编码来实现这种效果（设计）。我的意思是将文本滚动到另一侧等等。

某些浏览器仍然支持marquee元素。但是当我谷歌它时，一些网站说它不被Html 5支持。那么在Css 3中有哪些替代选项呢？

- Debabrata Karmakar

---

请查看以下网址：https://codepen.io/Jofiman/pen/JoGXMv - Sangam Belose

Answer 1

您可以使用 CSS 关键帧来制作跑马灯效果。

 <div class="marquee">
      <div>
        <span>This is marquee text...done with css keyframes without using marquee tag</span>
      <span>This is marquee text...done with css keyframes without using marquee tag</span>
    </div>



body { margin: 20px; }

.marquee {
  height: 25px;
  width: 600px;

  overflow: hidden;
  position: relative;
}

.marquee div {
  display: block;
  width: 200%;
  height: 30px;

  position: absolute;
  overflow: hidden;

  animation: marquee 5s linear infinite;
}

.marquee span {
  float: left;
  width: 50%;
}

@keyframes marquee {
  0% { left: 0; }
  100% { left: -100%; }
}

- Gokulakrishnan M

Answer 2

来自MDN

HTML <marquee> 元素用于插入一个滚动文本区域。您可以使用它的属性控制文本到达其内容区域边缘时会发生什么。

该元素已经过时，不应再使用。虽然某些浏览器仍然支持它，但并非必需。

CSS3中的Marquee

body {
  margin: 20px;
}

.marquee {
  height: 25px;
  width: 420px;
  overflow: hidden;
  position: relative;
}

.marquee div {
  display: block;
  width: 200%;
  height: 30px;
  position: absolute;
  overflow: hidden;
  animation: marquee 5s linear infinite;
}

.marquee span {
  float: left;
  width: 50%;
}

@keyframes marquee {
  0% {
    left: 0;
  }
  100% {
    left: -100%;
  }
}

<div class="marquee">
  <div>
    <span>You spin me right round, baby. Like a record, baby.</span>
    <span>You spin me right round, baby. Like a record, baby.</span>
  </div>
</div>

- Momin