IE Firefox Opera Chrome Safari 对MARQUEE标签的兼容问题

最新推荐文章于 2025-02-05 17:42:30 发布
最新推荐文章于 2025-02-05 17:42:30 发布
阅读量1.4w 收藏 4
点赞数 4
分类专栏： html5 文章标签： safari firefox chrome ie opera border
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/keymo_/article/details/7970358
版权
本文探讨了非W3C规范的MARQUEE元素在IE8(S), Firefox, Opera, Chrome和Safari中的兼容性问题，特别是当元素在表格或display为table的元素内，且direction属性改变时，对表格单元格宽度计算的影响。解决方案是为MARQUEE元素设定明确的宽度。" 119256067,11266748,理解与实践：数制转换详解,"['计算机科学', '基础概念', '进制转换', '数据表示', '数字系统']

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

标准参考

MARQUEE 元素不属于 W3C 规范中的元素，它最初由 IE2.0 引入，是微软为 IE 浏览器发明的特有元素，然而目前所有的主流浏览器均支持 MARQUEE 元素。

MARQUEE 元素用来创建一个文字滚动区域，并提供了一些特有的属性、方法及事件。

关于 MARQUEE 元素的详细资料，请参考 MSDN、Mozilla Developer Center、Safari Reference Library 中的内容。

问题描述

对于一个 'width' 特性的计算值为 auto 的 MARQUEE 元素，其内包含一个设有较大宽度的块级元素，MARQUEE 元素位于表格内或者 'display' 特性为 table 类型的元素内，则在 IE8(S), Firefox, Opera 中，当 MARQUEE 元素的 direction 属性为 up 或 down（即垂直方向滚动）时，计算的表格单元格的宽度会参考 MARQUEE 内明确设置了宽度的块级元素的宽度。而在 Chrom

最低0.47元/天 解锁文章
无间断滚动的新闻文章列表，兼容IE、Firefox和Opera，符合W3C标准。可作Marquee
01-19
<!–Quirks Mode–> <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” ... <head> <... charset=utf-8″ />...Fifty Studio│无间断滚动的新闻文章列表<...link rel=”s
marquee 的浏览器兼容性
ISaiSai的专栏
08-25 1万+
marquee 在IE，firefox，chrome 下都能正常的实现走马灯效果，兼容性没有问题
DIV内容滚动，文字符滚动标签marquee兼容稳定不卡
小熊猫
03-05 951
DIV内容滚动，文字符滚动标签marquee兼容稳定不卡 标签,是成对出现的标签,首标签和尾标签之间的内容就是滚动内容。 标签的属性主要有behavior、bgcolor、direction、width、height、hspace、vspace、loop、scrollamount、scrolldelay等，它们都是可选的。 marquee属性 behavior属性 behavior属性的参数值为alternate
iOS文字滚动：使用CATextLayer实现的跑马灯（附源码）
最新发布
weixin_39339407的博客
02-05 2010
通过本文，我们探讨了如何使用 CATextLayer 实现一个高效流畅的跑马灯效果。相比于 UILabel，CATextLayer在渲染性能上更具优势，特别是在需要动态更新和动画效果时，它能够提供更加平滑的用户体验。尽管 CATextLayer 支持的文本样式有限，但对于一些简单的文本显示需求，尤其是高效动画渲染，它无疑是一个理想的选择。在实际开发中，使用 CATextLayer 实现跑马灯效果，能够帮助我们节省性能开销，减少无谓的视图层级，同时通过 Core Animation 提供流畅的视觉体验。
marquee在IE8版本(兼容模式)不滚动
weixin_34208283的博客
04-06 663
随着各种软件的升级，我们系统中的IE6也渐渐被淘汰了，目前主流的浏览器一半的用户已经从IE6直接升级到了IE8，虽然给用户更好的体验，上网更快更方便了，但是对网站制作来说，又是个比较麻烦的问题，因为很多网页代码在不同的浏览器内显示的效果不一样，兼容性控制比较难把握。 今天有个问题在IE6下，做好的网站可到了客户电脑上打开却有点异常，因为原来一直使用的ma...
webkit中实现对marquee标签的屏蔽
白果果白的专栏
10-25 970
marquee标签包括开始标签与结束标签，解析两个标签时都会判定为marquee标签。 可以增加bool型类成员变量m_filterTag（初始值为false）用于标志是否进入标签，若为标签内部分，则不用添加节点，直接返回。 具体实现代码段如下： PassRefPtr HTMLTokenizer::processToken() { if (m_currentToken.tagName =
marquee：已经被逐步舍弃掉的强大的模拟滚动的标签
热门推荐
小小的客栈 大大的江湖
02-03 1万+
marquee：已经被逐步舍弃掉的强大的模拟滚动的标签
div+css+js实现无缝滚动类似marquee无缝滚动兼容firefox
12-08
div+css+javascript 实现无缝滚动,marquee无缝滚动，无缝滚动,兼容firefox 用marquee实现首尾相连循环滚动效果（仅IE）： 代码如下: <marquee behavior=”scroll” contenteditable=”true” xss=removed ...
HTMl 中marquee标签实现无缝滚动跑马灯效果
11-21
虽然`<marquee>`标签在现代网页开发中并不推荐使用，因为它的兼容性和可访问性较差，但是，对于一些简单的、对浏览器兼容性要求不高的项目，它仍然是一个快速实现滚动效果的选项。如果需要在各种浏览器上都能正常...
Vue替代marquee标签超出宽度文字横向滚动效果
10-15
通过以上两种方式，你可以用Vue实现类似`<marquee>`标签的文字滚动效果，同时保持代码的可维护性和兼容性。在实际开发中，可以根据项目需求选择合适的方法，确保用户体验的同时遵循最佳实践。在使用过程中，还可以...
火狐marquee_关于marquee标签在火狐里的兼容性问题
weixin_39601088的博客
12-20 316
}else{colee.scrollTop++}}var MyMar1=setInterval(Marquee1,speed)//设置定时器//鼠标移上时清除定时器达到滚动停止的目的colee.onmouseover=function() {clearInterval(MyMar1)}//鼠标移开时重设定时器colee.onmouseout=function(){MyMar1=setInterva...
HTML5 - 文字跑马灯标签(marquee)屏幕滚动文字
王佳斌
11-15 8366
属性 <marquee> </marquee> 标签有以下属性可选，在使用务必测试好各浏览器兼容性。 属性 描述 behavior 设置文本在 marquee 元素内如何滚动。可选值有 scroll，slide 和 alternate。 如果未指定值，默认值为 scroll。 bgcolor 通过颜色名称或十六进制值设置背景颜色。 directio...
转,marquee在IE6与FF中的兼容问题
weixin_30549657的博客
11-30 107
这些天一直在调MIBS柜面系统界面在IE6与火狐浏览器下的兼容问题。经理说让做两套样式，分别基于IE6和FF下，这样似乎更简便些。但我觉得调整兼 容性对我来说也不是什么难事，就试着调了调，样式上调起来比较快，半天时间就搞定了。唯独marquee在调的时候费了些周折，事后想想这倒是一个很好的 经验，应该写出来与大家分享，以后大家在遇到这个问题时至少可以少走点弯路，节省宝贵的时间。当然，也可能我这个...
marquee|各种文字滚动代码(适用公告)
u010046887的专栏
05-06 1150
转载：http://www.cnblogs.com/mountain-mist/articles/975781.html 1.建立第一个滚动字幕。代码：SupeSite/X-Space官方站+TzmCx hi4tH 我钟意网页树树 %[%[;};I*N0效果如： 我钟意网页树树 2.各参数详解：SupeSite/X-Space官方站j(A7Uq1E%w9{
网页顶部滚动消息组件（marquee）
wozhenhaokan的博客
10-25 725
网页顶部滚动消息组件（marquee）
火狐marquee_滚动字幕【兼容性：谷歌/火狐/IE6+】
weixin_34856060的博客
01-12 334
方法一：通过特殊标签滚动字幕：behavior(行为)="scroll(滚动)/alternate(晃动)"direction(方向)="up(从下向上)/down(从上向下)/left(从右向左)/right(从左向右)"scrollamount(滚动速度)="value"height="value(上下滚动范围)"width=""(左右滚动范围)>内容宽度自适应：块状元素，不设置宽度，或...
firefox 2 marquee兼容
cai555的专栏
10-31 320
新作的项目里面有个页面用到了&lt;marquee&gt;标签结果，在firefox下面就是不工作。无奈写了一段代码，用来替代简单的marquee功能：   /* * parameter: el -- marquee element * * html structure: * &lt;div ...&gt; * &lt;marquee ...&gt; * &lt;table w...
js实现不间断的marquee效果，兼容w3c标准
wangsen2235068的专栏
09-26 4918
<br /><style><br />#demo {<br />overflow:hidden;<br />height: 100px;<br />float: left;<br />}<br /></style><br />                                                                     <div id="demo"><br />                                                     
首尾相连的跑马灯效果（在IE Firefox Opera Safari中均已测试）
05-31
对于首尾相连的跑马灯效果，可以使用CSS3的动画实现，具体操作如下： HTML代码： ``` <div class="marquee"> <span>这是跑马灯显示的内容</span> <span>这是跑马灯显示的内容</span> <span>这是跑马灯显示的内容</span> <span>这是跑马灯显示的内容</span> </div> ``` CSS代码： ``` .marquee { width: 100%; overflow: hidden; white-space: nowrap; } .marquee span { display: inline-block; padding-right: 100%; animation: marquee 15s linear infinite; } @keyframes marquee { 0% {transform: translateX(0);} 100% {transform: translateX(-100%);} } ``` 解析： - 将需要滚动的内容包裹在一个div中，并设置其宽度为100%，overflow为hidden，white-space为nowrap，这样可以实现内容在一行中不换行的效果。 - 对于每一个需要滚动的内容，使用display:inline-block，padding-right:100%实现每一个内容向右平移，占据与其宽度相等的空间。 - 使用CSS3动画实现跑马灯效果。在@keyframes中设置从0%到100%的动画，分别将内容平移至0%和-100%的位置。在.marquee span中设置动画的时间为15s，线性运动，并且无限循环。 这样，就可以实现首尾相连的跑马灯效果。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值