marquee标签
是什么？
跑马灯效果，如图所示：
注意点：
marquee标签不是W3C推荐的标签，在W3C官方文档中无法查询这个标签，但是对各大浏览器支持非常好。
格式：
<marquee>内容</marquee>
代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>video</title>
</head>
<body>
<marquee>桃夭
桃之夭夭，灼灼其华。
之子于归，宜其室家。
桃之夭夭，有蕡其实。
之子于归，宜其家室。
桃之夭夭，其叶蓁蓁。
之子于归，宜其家人</marquee>
</body>
</html>
运行结果如图所示：
marquee中控制方向的属性：direction=""
从右往左
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>video</title>
</head>
<body>
<marquee direction="right">桃夭
桃之夭夭，灼灼其华。
之子于归，宜其室家。
桃之夭夭，有蕡其实。
之子于归，宜其家室。
桃之夭夭，其叶蓁蓁。
之子于归，宜其家人</marquee>
</body>
从下往上
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>video</title>
</head>
<body>
direction="up">桃夭
桃之夭夭，灼灼其华。
之子于归，宜其室家。
桃之夭夭，有蕡其实。
之子于归，宜其家室。
桃之夭夭，其叶蓁蓁。
之子于归，宜其家人</marquee>
</body>
marquee的第二个属性：scorllamount="1"滚动的速度，值越大，速度越快。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>video</title>
</head>
<body>
<marquee scorllamount="1">桃夭
桃之夭夭，灼灼其华。</marquee>
<marquee scorllamount="1">之子于归，宜其室家。</marquee>
<marquee scorllamount="10">桃之夭夭，有蕡其实。</marquee>
<marquee scorllamount="100">之子于归，宜其家室。</marquee>
<marquee scorllamount="1000">桃之夭夭，其叶蓁蓁。</marquee>
<marquee loop="1" scorllamount="100">之子于归，宜其家人</marquee>
<marquee loop="1" scorllamount="100" behavior="slide">之子于归，宜其家人</marquee>
</body>
</html>
注：1)loop设置滚动的次数。
2)behavior="slide"设置滚动的类型。slide滚动到边界就停止。alternate滚动到边界就弹回。（大家自己尝试看到效果好些，因为动态的，不好截图）
拓展练习：
试一试图片是否实现跑马灯效果。
网友评论