Home >Web Front-end >HTML Tutorial >HTML code to create scrolling text
HTML code to create scrolling text
- 不言Original
- 2018-05-07 16:13:015287browse
This article mainly introduces the HTML code to produce scrolling text. It has a certain reference value. Now I share it with you. Friends in need can refer to it.
In this section, the author talks about the special features of HTML code. Tag, which can scroll the text in the web page and control its scrolling properties.
Create scrolling text Through the previous studies in this chapter, readers have been able to well control the display method of various paragraph text, but no matter how they are set, the text is static.
In this section, the author talks about the special tags in HTML code, which can make the text in the web page scroll and control its scrolling properties.
Create scrolling text
Through the previous studies in this chapter, readers have been able to well control the display mode of various paragraph text, but no matter how they are set, the text is static. In this section, the author describes the special tags in HTML code, which can scroll the text in the web page and control its scrolling properties.
4.3.1 Set text scrolling
The way to scroll text in HTML technology is to use double tags ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b. In the HTML code, the text in the scope can be scrolled. The default is from right to left and circular scrolling. Create a web page file in the D:\web\ directory, name it mar.htm, and write the code as shown in Code 4.15.
Code 4.15 Text scrolling setting: mar.htm
<html> <head> <title>文字滚动的设置</title> </head> <body> <font size="5" color="#cc0000"> 文字滚动示例（默认）：<marquee>做人要厚道</marquee> </font> </body> </html>
Enter http://localhost/mar.htm in the browser address bar, and the browsing effect is as shown in Figure 4.15. 
Figure 4.15 Set the default form of text scrolling
From Figure 4.15, it can be seen that when the width is not set, the ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b label occupies an exclusive line.
4.3.2 Set the direction of text scrolling
ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31bThe direction attribute of the tag is used to set the direction of content scrolling. The attribute values are left, right, up, and down. , representing left, right, up, and down respectively, such as the following code:
6edd4cf7db8e54f5a2714b6e5bfaaeb6Be kind7204e33a7a23f6efcc788532e245c31b
d5dbfb15f55e102e762be1a599f12f90Be kind7204e33a7a23f6efcc788532e245c31b
b80c9443827c2c66174cdf5ae2d19de2Be kind7204e33a7a23f6efcc788532e245c31b
3123260f88cd0a47060911ddbcb26693Be kindb1caf867bf930ab1d3cf8f70a13b09f1
4.3.3 Set the speed and form of text scrolling
To set text scrolling, use the ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b tag, and its attributes are described as follows.
— The scrollamount attribute of the ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b tag is used to set the content scrolling speed.
— The behavior attribute of the ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b tag is used to set the content scrolling method. The default is scroll, which is cyclic scrolling. When its value is alternate, the content will scroll back and forth in a cyclical manner. When its value is slide, the content will stop scrolling once and will not loop. There is also a loop attribute to set the number of scrolling cycles, which defaults to no limit.
— The scrolldelay attribute of the ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b tag is used to set the time interval for content scrolling.
— The bgcolor attribute of the ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b tag is used to set the content scrolling background color (similar to the background color setting of the body).
— The width attribute of the ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b tag is used to set the content scrolling background width.
— The height attribute of the ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b tag is used to set the height of the content scrolling background.
Modify the mar.htm web page file and write the code as shown in code 4.16.
Code 4.16 Text scrolling setting: mar.htm
<html> <head> <title>文字滚动的设置</title> </head> <body> <font size="3" color="#cc0000"> 文字滚动示例（默认）：<marquee>做人要厚道</marquee> 文字滚动示例（向右）：<marquee direction="right" scrolldelay="500">做人要厚道</marquee> 文字滚动示例（向下，滚动方式为slide，速度为10）：<marquee scrollamount="10" behavior="slide">做人要厚道</marquee> 文字滚动示例（默认方向，滚动方式为alternate，循环3次，速度为2）：<marquee scrollamount="2" behavior="alternate" loop="3">做人要厚道</marquee> 文字滚动示例（向上，背景色为#CCFF66，设置了背景宽度和高度）：<marquee direction="up" bgcolor="#CCFF66" width="250" height="55">做人要厚道</marquee> </font> </body> </html>
Enter http://localhost/mar.htm in the browser address bar, and the browsing effect is as shown in Figure 4.16. 
Figure 4.16 Different forms of text scrolling
ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b’s many properties can make scrolling text very convenient. In the following JavaScript learning, readers will continue to deepen Dynamic behavioral learning of ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b tags.
Related recommendations:
HTML code to implement a simple shopping cart
##
The above is the detailed content of HTML code to create scrolling text. For more information, please follow other related articles on the PHP Chinese website!