由于marquee
HTML标记已过时,我想知道,现在这样做的正确方法是什么?我已经看到很多jQuery
和Javascript
个片段可以完成相同的任务,但我希望可以这么说,马戏团中有一个新的“标准”。
我见过的CSS代码段如下:
overflow-style: marquee-line;
marquee-style: line;
但它们似乎并不适用于所有浏览器(或某些情况下)。我知道它被视为一个“90年代”的主题创意,但有一些目的仍然需要它,我的网站上的我的收入代码确实需要滚动以最大化每个可用像素的内容。
答案 0 :(得分:2)
没有"标准"这就像我们之前的HTML标签一样,不需要造型。但在一天结束时,这样做会更好。我们可以控制我们打算显示的每个对象的所有方面,而不是总是依赖于默认值。这对于整体用户体验来说更好,而且不在StackOverflow的范围内,但在大多数情况下,一般来说,marquees已经超出了良好用户体验的范围。
如果你想更深入地了解它,你应该注意一些跨浏览器的差异,你可能需要调整宽度和缩进以满足你的需求,但这应该让你去:
<div class="marquee">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
.marquee {
width: 300px;
margin: 0 auto;
overflow: hidden;
white-space: nowrap;
box-sizing: border-box;
animation: marquee 50s linear infinite;
}
@keyframes marquee {
0% { text-indent: 27.5em }
100% { text-indent: -105em }
}