一个有意思的标签<marquee>
marquee标签不是HTML3.2的一部分,并且只支持MSIE3以后内核,所以如果你使用非IE内核浏览器(如:Netscape)可能无法看到下面一些很有意思的效果,该标签是个容器标签。
一、marquee标签的几个重要属性:
1.direction:滚动方向(包括4个值:up、down、left、right)
说明:up:从下向上滚动;down:从上向下滚动;left:从右向左滚动;right:从左向右滚动。
语法:<marquee direction="滚动方向">...</marquee>
2.behavior:滚动方式(包括3个值:scroll、slide、alternate)
说明:scroll:循环滚动,默认效果;slide:只滚动一次就停止;alternate:来回交替进行滚动。
语法:<marquee behavior="滚动方式">...</marquee>
3.scrollamount:滚动速度(滚动速度是设置每次滚动时移动的长度,以像素为单位)
语法:<marquee scrollamount="5">...</marquee>
4.scrolldelay:设定滚动两次之间的延迟时间,值大了会有一步一停顿的效果(设置滚动的时间间隔,单位是毫秒)
语法:<marquee scrolldelay="100">...</marquee>
5.loop:设定滚动循环的次数(默认值是-1,滚动会不断的循环下去)
语法:<marquee loop="2">...</marquee>
<marquee loop="-1" bgcolor="#CCCCCC">我会不停地走。</marquee>
<marquee loop="2" bgcolor="#CCCCCC">我只走两次哦</marquee>
6.width、height:设定滚动字幕的宽度、高度
语法:<marquee width="500" height="200">...</marquee>
7.bgcolor:设定滚动字幕的背景颜色(可以是颜色值,也可以是rgb()或rgba()函数)
语法:<marquee bgcolor="rgba(0,0,0,0.2)">...</marquee>
8.hspace、vspace:空白空间(相当于设置margin值)
说明:hspace:设定活动字幕里所在的位置距离父容器水平边框的距离,如hspace=“10”,即等同于:margin:0 10px;
vspace:设定活动字幕里所在的位置距离父容器垂直边框的距离,如vspace=“10”,即等同于:margin:10px 0;
语法:<marquee hspace="10" vspace="10">...</marquee>(等同于:margin:10px;)
9.align:设定滚动字幕内容的对齐方式(包括9个值:absbottom、absmiddle、baseline、bottom、left、middle、right、 texttop、top)
说明:absbottom:绝对底部对齐(与g、p等字母的最下端对齐)
absmiddle:绝对中央对齐
baseline:底线对齐
bottom:底部对齐(默认)
left:左对齐
middle:中间对齐
right:右对齐
texttop:顶线对齐
top:顶部对齐
语法:<marquee align="对齐方式">...</marquee>
10.face:设定滚动字幕的文字字体
语法:<marquee font="楷体_GB2312"></marquee>
11.color:设定滚动字幕的文字颜色
语法:<marquee color="#333"></marquee>
12.size:设定滚动字幕的文字字号
语法:<marquee size="3"></marquee>
13.STRONG:设定滚动字幕的文字加粗
语法:<marquee STRONG></marquee>
二、marquee常用到的两个事件:
onMouseOut="this.start()" 用来设置鼠标移出该区域时继续滚动
onMouseOver="this.stop()" 用来设置鼠标移入该区域时停止滚动
<marquee onMouseOut="this.start()" onMouseOver="this.stop()">marquee常用到的两个事件</marquee>
完整代码如下:
<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>参数不少,但毕竟不能实现复杂的和自定义的特殊跑马灯效果,而且还有浏览器限制,所以我们更多情况下会采用JavaScript来实现跑马灯滚动效果。
一个有意思的标签<marquee>的更多相关文章
- 一个神奇的HTML标签-----marquee
今天无意中发现了一个html标签 - <marquee></marquee>可以实现多种滚动效果,无需js控制. 语法:<marquee>...</marqu ...
- 自动滚动标签marquee
<marquee>标签,它是成对出现的标签,首标签<marquee>和尾标签</marquee>之间的内容就是滚动内容.<marquee>标签的属性主要 ...
- HTML标签marquee 来制作页面滚动
页面的自动滚动效果,可由javascript来实现,但是今天无意中发现了一个html标签 - <marquee></marquee>可以实现多种滚动效果,无需js控制. 使用m ...
- 一个有意思的CSS样式库--BUTTONS
我最近发现了一个有意思的CSS样式库,和Bootstrap相似,但是它是专门的一个高度可定制的,免费的并且开源的按钮CSS样式库,这里附上它的网址:http://www.bootcss.com/p/b ...
- HTML标签marquee实现滚动效果
html标签 - <marquee></marquee>可以实现多种滚动效果,无需js控制.使用marquee标记不仅可以移动文字,也可以移动图片,表格等.只需要在<ma ...
- linux下一个有意思的问题(文件名以短划线或空格开头)
linux下一个有意思的问题(文件名以短划线开头) 这本是无意中的一个发现. 在linux下,文件名中含有 - 是没有问题,但是如果文件名是以-作为第一个字符的,那么就比较麻烦了. 问题演示 看这里, ...
- [原创]java WEB学习笔记40:简单标签概述(背景,使用一个标签,标签库的API,SimpleTag接口,创建一个自定义的标签的步骤 和简单实践)
本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当 ...
- Python一个有意思的地方:reduce、map、filter
今天阅读了关于Python函数式编程的系列文章,地址在这里: http://www.cnblogs.com/huxi/archive/2011/06/24/2089358.html 里面提到了四个内建 ...
- javascript--获取一个页面各个标签的数量
获取一个页面各个标签的数量 document.getElementsByTagName('*')--获取所有的标签. var obj = document.getElementsByTagName(' ...
随机推荐
- flask综合整理2
session功能 首先我们知道session可以理解是一把钥匙,它存在在服务器上,其实在flask中也有session 1.系统自带的session from flask import sessio ...
- 深入学习keepalived之预备工作--线程
1. 线程的定义 1.1 线程定义在scheduler.h文件中,其定义如下所示 /* Thread itself. */ typedef struct _thread { unsigned long ...
- Windows 下推荐软件
神器 Dism++ Quicker(效率工具) Bandizip 火绒安全软件 Everyting(搜索神器并支持http远程连接) Xmanager VMware Workstation IDMan ...
- nginx 导致文件上传中途中断 Failed to load resource: net::ERR_CONNECTION_RESET
昨天上传文件出了问题,常常在进度条到一半的时候就终止了.在本地测试的时候倒是没问题,今天早上用花生壳换了另一个域名,在我本地和服务器都测试,却能够上传文件成功.然后就想到了可能是nginx的问题,也在 ...
- vue路由配置
1.安装 npm install vue-router --save / cnpm install vue-router --save 2.引入并 Vue.use(VueRouter) (main.j ...
- PHP file_put_contents() 函数
file_put_contents() 函数把一个字符串写入文件中. 与依次调用 fopen(),fwrite() 以及 fclose() 功能一样. 语法如下 file_put_contents(f ...
- Sass学习笔记(三)
一.Sass的控制命令 二.Sass的函数功能 sass中除了可以定义变量,还自备了一系列函数功能,主要包括:字符串函数.数字函数.列表函数.颜色函数.Instrospection函数.三元函数等.当 ...
- SQLAlchemy的使用---外键ForeignKey数据库创建与连接
# 一对多建表操作 from sqlalchemy.ext.declarative import declarative_base Base = declarative_base() from sql ...
- shell 重启 tomcat 脚本
#!/bin/sh # author hapday -- export TOMCAT_HOME=/usr/local/tomcat-pms tomcat_pid=$(ps -ef | grep ${T ...
- 关于Activity
Activity与界面 1.Activity相当于浏览器的标签.相当于空白的网页,界面相当于浏览器内的网页. 2.将Activity与界面绑定就相当于在浏览器内填写了相应的网页. 3.Activity ...