详解html中的marquee属性
转自:https://www.jb51.net/web/531309.html
该标签不是HTML3.2的一部分,并且只支持MSIE3以后内核,所以如果你使用非IE内核浏览器(如:Netscape)可能无法看到下面一些很有意思的效果
该标签是个容器标签
语法:
1
|
< marquee ></ marquee > |
以下是一个最简单的例子:
代码如下:
1
|
< marquee >< font size=+3 color = red >Hello, World</ font ></ marquee > |
下面这两个事件经常用到:
onMouseOut="this.start()" :用来设置鼠标移出该区域时继续滚动
onMouseOver="this.stop()":用来设置鼠标移入该区域时停止滚动
代码如下:
1
|
< marquee onMouseOut = "this.start()" onMouseOver = "this.stop()" >onMouseOut="this.start()" :用来设置鼠标移出该区域时继续滚动 onMouseOver="this.stop()":用来设置鼠标移入该区域时停止滚动</ marquee > |
这是一个完整的例子:
代码如下:
1
2
3
|
< marquee id = "affiche" align = "left" behavior = "scroll" bgcolor = "#FF0000" direction = "up" height = "300" width = "200" hspace = "50" vspace = "20" loop = "-1" scrollamount = "10" scrolldelay = "100" onMouseOut = "this.start()" onMouseOver = "this.stop()" > 这是一个完整的例子 </ marquee > |
该标签支持的属性多达11个:
align
设定<marquee>标签内容的对齐方式
absbottom:绝对底部对齐(与g、p等字母的最下端对齐)
absmiddle:绝对中央对齐
baseline:底线对齐
bottom:底部对齐(默认)
left:左对齐
middle:中间对齐
right:右对齐
texttop:顶线对齐
top:顶部对齐
代码如下:
1
2
3
4
5
6
7
8
9
|
< marquee align = "absbottom" >align="absbottom":绝对底部对齐(与g、p等字母的最下端对齐)。 </ marquee > < marquee align = "absmiddle" >align="absmiddle": 绝对中央对齐。 </ marquee > < marquee align = "baseline" >align="baseline": 底线对齐。 </ marquee > < marquee align = "bottom" >align="bottom": 底部对齐(默认)。 </ marquee > < marquee align = "left" >align="left": 左对齐。 </ marquee > < marquee align = "middle" >align="middle": 中间对齐。 </ marquee > < marquee align = "right" >align="right": 右对齐。 </ marquee > < marquee align = "texttop" >align="texttop": 顶线对齐。 </ marquee > < marquee align = "top" >align="top": 顶部对齐。 </ marquee > |
behavior
设定滚动的方式:
alternate: 表示在两端之间来回滚动。
scroll: 表示由一端滚动到另一端,会重复。
slide: 表示由一端滚动到另一端,不会重复。
代码如下:
1
2
3
|
< marquee behavior = "alternate" >alternate:表示在两端之间来回滚动。 </ marquee > < marquee behavior = "scroll" >scroll:表示由一端滚动到另一端,会重复。</ marquee > < marquee behavior = "slide" >slide: 表示由一端滚动到另一端,不会重复。</ marquee > |
bgcolor
设定活动字幕的背景颜色,背景颜色可用RGB、16进制值的格式或颜色名称来设定。
代码如下:
1
2
3
|
< marquee bgcolor = "#006699" >设定活动字幕的背景颜色 bgcolor="#006699"</ marquee > < marquee bgcolor = "RGB(10%,50%,100%,)" >设定活动字幕的背景颜色 bgcolor="rgb(10%,50%,100%,)"</ marquee > < marquee bgcolor = "red" >设定活动字幕的背景颜色 bgcolor="red"</ marquee > |
direction
设定活动字幕的滚动方向
代码如下:
1
2
3
4
|
< marquee direction = "down" >设定活动字幕的滚动方向direction="down":向下</ marquee > < marquee direction = "left" >设定活动字幕的滚动方向direction="left":向左</ marquee > < marquee direction = "right" >设定活动字幕的滚动方向direction="right":向右</ marquee > < marquee direction = "up" >设定活动字幕的滚动方向direction="up":向上</ marquee > |
height
设定活动字幕的高度
代码如下:
1
|
< marquee height = "500" direction = "down" bgcolor = "#CCCCCC" >设定活动字幕的高度height="500"</ marquee > |
width
设定活动字幕的宽度
代码如下:
1
|
< marquee width = "500" bgcolor = "#CCCCCC" >设定活动字幕的宽度width="500"</ marquee > |
hspace
设定活动字幕里所在的位置距离父容器水平边框的距离
This controls the horizontal(水平)space around the display box.
代码如下:
1
2
3
4
5
|
< table width = "500" border = "1" align = "center" cellpadding = "0" cellspacing = "0" > < tr > < td >< marquee hspace = "100" bgcolor = "#CCCCCC" >hspace="100"</ marquee ></ td > </ tr > </ table > |
vspace
设定活动字幕里所在的位置距离父容器垂直边框的距离
This controls the vertical(垂直) space around the display box.
代码如下:
1
|
< marquee vspace = "100" bgcolor = "#CCCCCC" >hspace="100"</ marquee > |
loop
设定滚动的次数,当loop=-1表示一直滚动下去,默认为-1
代码如下:
1
2
3
|
< marquee loop = "-1" bgcolor = "#CCCCCC" >我会不停地走。</ marquee > < p > </ p > < marquee loop = "2" bgcolor = "#CCCCCC" >我只走两次哦</ marquee > |
scrollamount
设定活动字幕的滚动速度,单位pixels
代码如下:
1
2
3
|
< marquee scrollamount = "10" >scrollamount="10" </ marquee > < marquee scrollamount = "20" >scrollamount="20" </ marquee > < marquee scrollamount = "30" >scrollamount="30" </ marquee > |
scrolldelay
设定活动字幕滚动两次之间的延迟时间,单位millisecond(毫秒)
值大了会有一步一停顿的效果
代码如下:
1
2
3
|
< marquee scrolldelay = "10" >scrolldelay="10" </ marquee > < marquee scrolldelay = "100" > scrolldelay="100"</ marquee > < marquee scrolldelay = "1000" >scrolldelay="1000" </ marquee > |
详解html中的marquee属性的更多相关文章
- 举例详解CSS中的cursor属性
这篇文章主要举例介绍了CSS中的cursor属性,包括zoom-in/zoom-out和grab/grabbing等常用属性值的使用,需要的朋友可以参考下 一.开篇之言 CSS3的领域范围已经渗透到了 ...
- 详解css中的position属性
这一次直接进入主题. css中最常用的布局类属性,一个是float,另一个就是定位属性position. 对于position来讲,有以下属性值: static : 无特殊定位,对象处于正常文档流.其 ...
- 转: 详解css中的display属性
在一般的CSS布局制作时候,我们常常会用到display对应值有block.none.inline这三个值.下面我们来分别来认识和学习什么时候用什么值.这里通过CSS display知识加实例讲解方法 ...
- 详解 javascript中offsetleft属性的用法(转)
详解 javascript中offsetleft属性的用法 转载 2015-11-11 投稿:mrr 我要评论 本章节通过代码实例介绍一下offsetleft属性的用法,需要的朋友可以做一 ...
- (转载)详解Javascript中prototype属性(推荐)
在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不存在类(Class)的概念的,javascript中不 ...
- 【转】详解C#中的反射
原帖链接点这里:详解C#中的反射 反射(Reflection) 2008年01月02日 星期三 11:21 两个现实中的例子: 1.B超:大家体检的时候大概都做过B超吧,B超可以透过肚皮探测到你内 ...
- 详解Webwork中Action 调用的方法
详解Webwork中Action 调用的方法 从三方面介绍webwork action调用相关知识: 1.Webwork 获取和包装 web 参数 2.这部分框架类关系 3.DefaultAction ...
- java 乱码详解_jsp中pageEncoding、charset=UTF -8"、request.setCharacterEncoding("UTF-8")
http://blog.csdn.net/qinysong/article/details/1179480 java 乱码详解__jsp中pageEncoding.charset=UTF -8&quo ...
- (转)详解Python3 中hasattr()、getattr()、setattr()、delattr()函数及示例代码数
原文:https://www.jb51.net/article/138363.htm hasattr()函数 hasattr()函数用于判断是否包含对应的属性 语法: hasattr(object,n ...
随机推荐
- [代码质量] 代码质量管控 -- 复杂度检测 (JavaScript)
转载自: https://juejin.im/post/59bb8b546fb9a00a4247532e 背景 代码的复杂度是评估一个项目的重要标准之一.较低的复杂度既能减少项目的维护成本,又能避免一 ...
- jar第三方组件Dependency-check依赖检查工具
jar第三方组件Dependency-check依赖检查工具 http://www.mianhuage.com/913.html 工具下载 http://dl.bintray.com/jeremy-l ...
- implement a list using Rust
Rust果然比較複雜,在經歷了n次compile fail,終于寫成了一個 list 難點: 對Rc<>的用法不熟悉.對borrow checker不夠熟悉 有些寫法可能還不是最短的 us ...
- mysql-connector-java(6.0以上)的时差问题
一.背景 通过mybatis日志观察插入数据库的时间为当前时间,但是打开数据库表发现时间滞后了8个小时. 二.推论及解决 很容易猜到这是时区的问题. 三.最后找到的问题点如下: jdbc:mysql: ...
- window上可以执行的shell脚本,复制到linux上执行报错了
原因:.sh脚本在windows系统下用记事本文件编写的.不同系统的编码格式引起的. 解决方法:修改.sh文件格式 (1)使用vi工具vi build_android.sh (2)利用如下命令查看文件 ...
- 123456123456#6#---###6%%%----com.zzj.DinosourKnown235---前拼show后广--恐龙百科-66666666
com.zzj.DinosourKnown235---前拼show后广--恐龙百科-
- 容器版jenkins使用宿主机的docker命令
参照里面的第一步里面的dockerfile: https://www.cnblogs.com/effortsing/p/10486960.html
- JIT(just in time)即时编译器
JIT(just in time) 前端vs后端 在编译原理中,通常将编译分为前端和后端.其中前端会对程序进行词法分析.语法分析.语义分析,然后生成一个中间表达形式(称为IR:Intermediate ...
- kexue shangwang
根据实践,pptp.IPsec甚至OpenVPN等kexue上网法已经无法顺利翻越GFW.通过抓包可知,GFW会将pptp的握手期间的ack包吞掉,导致本地一直无法收到服务器端的响应.而OpenVPN ...
- QT笔记--事件处理
1 事件是什么 这里的事件主要是用户输入事件,比如点击一个按钮,选中复选框等.当事件发生的时候,达到我们满意的效果. 2信号与槽 connect(A,XX,B,YY) 当A事件发生的时候,B中的处理函 ...