在html5和css3中创建无字幕的可滚动内容
长期以来一直在编写HTML的人可能还记得该元素。这是一个特定于浏览器的元素，创建了在屏幕上滚动文本的横幅。该元素从未添加到HTML规范中，对它的支持在不同浏览器中差异很大。人们通常对这个元素的使用有着非常强烈的意见——无论是正面的还是负面的。但不管你喜欢还是讨厌它，它确实起到了让溢出框边界的内容可见的作用。
除了强烈的个人观点外，浏览器从未完全实现它的部分原因是，它被认为是一种视觉效果，因此，它不应该由定义结构的HTML定义。相反，视觉或呈现效果应该由CSS管理。CSS3添加了选框模块，以控制浏览器如何向元素添加选框效果。
新的css3属性
CSS3添加了五个新属性来帮助控制内容在字幕中的显示方式：溢出样式、字幕样式、字幕播放计数、字幕方向和字幕速度。
溢出样式溢出样式属性（我们也在CSS overflow一文中讨论过）定义溢出内容框的内容的首选样式。如果将该值设置为“选框线”或“选框块”，则内容将滑入或滑出到左/右（选框线）或上/下（选框块）。
字幕样式此属性定义内容如何移入视图（和移出）。选项包括滚动、滑动和交替。滚动从内容完全脱离屏幕开始，然后在可见区域移动，直到内容再次完全脱离屏幕。幻灯片开始时，内容完全脱离屏幕，然后在屏幕上移动，直到内容完全移到屏幕上，屏幕上再也没有可滑动的内容。最后，alternate将内容从一侧反弹到另一侧，前后滑动。
选框播放计数使用选框元素的缺点之一是选框从不停止。但是，使用style属性marquee play count，您可以设置marquee以打开和关闭内容特定次数。
字幕方向您还可以选择内容在屏幕上滚动的方向。当溢出样式为选框线时，向前和向后的值基于文本的方向性；当溢出样式为选框块时，向上或向下的值基于文本的方向性。
选框方向细节
- 发表于 2021-09-04 23:20
- 阅读 ( 181 )
- 分类：IT
你可能感兴趣的文章
html5(html5)和闪光(flash)的区别
...L是internet的核心技术标记语言，用于构建和呈现万维网的内容。HTML5是WWW超文本标记语言的最后一个完整的第5次修订版。HTML5是HTML的改进版，支持最新的多媒体，同时保持其易读性。它也是一个跨平台的移动应用。因此，HTML5可...
你应该使用12个很棒的html5模板
...单页格式是一个很好的选择。这个模板使用HTML5创建一个滚动的单页站点，它可以很好地用于一个非常简单的公文包。 ...
7所有网站开发人员都应该知道的编程技巧
...技术，使现代网络工作，并能够支持丰富的互动和多媒体内容。新版本HTML5提供了比以前更多的选项和功能。 ...
11 css模板网站：不要从头开始！
...们小巧轻便，具有额外的Javascript功能，比如视频灯箱或滚动效果，只在为体验增加真正价值的地方使用。 ...
如何使用字幕工具在premiere pro中创建动态字幕
众所周知，字幕曾一度被观众拒之门外，但随着科技的兴起，字幕在某种程度上已成为一种必需品。随着注意力广度的减少，耳朵里塞满了AirPods，观众真正听你视频的时间越来越少。 ...
如何改变netflix的语言
...为它不是你的母语？或者你想看另一种语言的电影还是有字幕的？然后继续读下去，因为在Netflix上改变语言很容易。 ...
想成为一名网络开发者吗？这是终极训练营
... 这些课程总共提供超过69小时的网页开发和设计内容。你可以以39.99美元的价格买到最终的Web开发和设计包，低于2200美元的正常价格。 ...
如何学会用简单的方法编写代码（并赚更多的钱）
...响应现实世界项目和web开发人员项目训练营的课程。课程内容引人入胜，直观，最好的部分是社区参与。 ...
如何启用和自定义迪士尼字幕+
...其他流媒体平台一样，Disney+通过为电影和电视节目提供字幕来迎合多语种和听力障碍的客户。如果您想在Disney+上启用、禁用或自定义字幕，下面是您需要做的。 启用或禁用迪士尼字幕+ 所有主要的迪斯尼+电视节目和电影都有字...
如何更改netflix个人资料、字幕和音频语言
...容易地看其他语言的电影和节目。也有改变语言的音频，字幕，或在您的个人资料，无论你住在哪里。让我们一起探索吧！ 如何更改netflix个人资料中的语言 Netflix通常根据你的位置来决定它使用的语言。例如，在美国，你会得...
0 篇文章
