实例教程：HTML中会移动的文字

我们在浏览页面的时候会看到在页面上移动的文字文字的移动方向有从左到右、从右到左、从上到下、从下到上等。下面我们来看看如何使用HTML代码编写会移动的文字吧。

工具/材料

HTML

1:语法代码
1一般使用<marquee></marquee>来设置移动文字比如我们编写如下代码
2<marquee>会移动的文字</marquee>
预览效果可以发现编写在<marquee></marquee>标签内的文字会从右边到左边循环移动如下图所示
2:文字移动速度
1使用scrollamount来设置文字的移动速度比如我们编写如下所示代码
<marquee scrollamount=16>快点快点</marquee>
<marquee scrollamount=12>等等我</marquee>
2预览效果
可以看到scrollamount的数值越大移动的速度就会越快如下图所示
3:设置文字移动的方向
1direction在英文上是方向的意思同样使用direction来设置文字的移动方向方向可以设置为左、右、上、下等等编写如下代码
<marquee direction=left>文字从右边向左边</marquee> <P>
<marquee direction=right>从左边向右边移</marquee>
2预览效果
可以看到当direction=left时文字从右边向左边当direction=right时文字从左边向右边如下图所示
4:文字循环的次数
1文字是默认无限次循环的下面我们来看看如何指定文字的循环次数吧。使用loop来设置文字的循环次数比如编写代码如下
<marquee loop=3 >文字只会循环三次</marquee>
2预览效果
可以在浏览器上看到文字只会循环三次如下图所示
5:文字对齐
在HTML中的文字对齐功能使用align属性来设置属性值可以为top、Middle、button比如我们编写如下所示的代码

2预览效果
然后在浏览器中预览效果可以看到文字向上对齐如下图所示
6:移动面积
1设置会移动的文字范围比如文字在长为多少宽为多少的区域内移动比如我们编写如下代码
<marquee height=40 width=50% bgcolor=pink>在区域内移动的文字</marquee>
2预览效果
在浏览器中可以看到文字在高为40宽为浏览器一半的区域内移动且区域的颜色为粉红色如下图所示
7:延时
1设置文字的运行速度让文字可以时而快时而慢地做运动编写代码如下所示

2预览效果
在浏览器中预览效果可以看到文字先做快速度然后做慢速度如下图所示