Home > Developer > Web Develop
What are Html code? Today, the Helper house editor provides you with Html code tutorials, which collect some common Html code. You may wish to refer to them.
Common Html code tutorial 1. Text
1. Title text
2. font changes <font> ...... </font>
[1] font size <font size = #> ...... </font> # = 1 ~ 7. The larger the number, the larger the number.
[2] specify the font <font face = "font name"> ...... </font>
[3] text color <font color = # rrggbb> ...... </font>
Rr: red table color code
Gg: green color code of the table
Bb: Table blue color code
Rrggbb can also contain 6-digit color code numbers.
3. Show the small font <small> ...... </small>
4. display the large font <big> ...... </big>
5. Bold Chinese characters <B> ...... </B>
6. Italics <I>... </I>
7. typewriter font <tt> ...... </tt>
8. Bottom line <u> ...... </u>
9. strikethrough <strike> ...... </strike>
10. subscripts <sub> ...... </sub>
11. superscript <sup> ...... </sup>
12. Text flashing effect <blink> ...... </blink>
13. line feed (also called carriage return) <br>
14. Segmentation <p>
15. the text align direction <p align = "#"> # can be left: The table is left aligned (default value) center: The table is center aligned right: The table is right aligned P.S. <p align = "#"> the subsequent text is displayed in the alignment mode until another <p align = "#"> change the alignment direction, when a
16. separation line
[1] separator width
[2] split line width
[3] separation line align direction
# No. can be left: Table to left alignment (default value) center: Table to center alignment right: Table to right alignment
[4] separator color
[5] solid separation line
17. center alignment <center> ...... </center>
18. Display <pre> ...... </pre> according to the original style
19. <body> command attributes
[1] background color -- bgcolor <body bgcolor = # rrggbb>
[2] background pattern -- background <body background = "graphic file name">
[3] set the background pattern to not scroll -- bgproperties <body bgproperties = fixed>
[4] text color of the file content-text <body text = # rrggbb>
[5] hyperlink text color -- link <body link = # rrggbb>
[6] The text color of the hyperlink being selected -- vlink <body vlink = # rrggbb>
[7] the color of the hyperlink text that has been linked-alink <body alink = # rrggbb>
20. Text movement instructions <MARQUEE> ...... </MARQUEE>
The movement speed command is scrollAmount ### the minimum value is 1, and the speed is the slowest. The larger the number, the faster the movement.
The direction command is: direction = # up, down, left to left, right to the right.
Command example: <MARQUEE scrollAmount = 3 direction = up> ...... </MARQUEE>
Common Html code tutorial 2. Images
1. Insert an image
2. Set the image frame-border
3. Set the image size -- width and height
4. Set the left and right sides of the image to be left blank. -- vspace and hspace
5. graphic note
6. Pre-upload images
P.S. It is recommended that the two images have the same size;
7. Image Map <map name = "Image name">
<Area shape = shape coords = region coordinate list href = "link URL">
<Area shape = shape coords = region coordinate list href = "link URL">
<Area shape = shape coords = region coordinate list href = "link URL">
<Area shape = shape coords = region coordinate list href = "link URL"> </map>
[1] define shape-shape
Shape = rect: rectangular shape = circle: circular shape = poly: Polygon
[2] define a region-coords
A. rectangle: four digits are required. The first two digits are the coordinates in the upper left corner, and the last two digits are the coordinates in the lower right corner.
Example: <area shape = rect coords =, 50, href = "URL">
B. Circle: three digits must be used. The first two digits are the coordinates of the center, and the last digit is the radius length.
Example: <area shape = circle coords = 85,155, 30 href = "URL">
C. Any image (polygon): Fill in the coordinates of each turning point of the image in order
Example: <area shape = poly coords = 232,70, 285,70, 90, 78 href = "URL"
Common Html code tutorial 3. Table-related
1. Table title
<Caption> ...... </caption>
Table title location-align
<Caption align = "#"> # top: The table title is placed above the table (default value)
Bottom: The table title is placed below the table
2. Define a column <tr>
3. Define column 1 <td>: Align to the left
2 <th>: align with the center in bold II
[1] horizontal position -- align <th align = "#">
# Align left: Align center: Align right
[2] vertical position -- align <th align = "#"> # can be
Top: Align up middle: Align to center bottom: Align down
[3] Bar width -- width <th width = points or percentage>
[4] column vertical merge -- rowspan <th rowspan = number of columns to be merged>
[5] column horizontal merge -- colspan <th colspan = number of columns to be merged>
Common Html code tutorial 4. main attributes of a table
1. <table> MARK main attributes
Align defines the alignment of a table. It has three attribute values: center, left, right.
Background defines the background pattern of the table. The attribute value is the image address.
Bgcolor defines the background color of the table. The attribute value is a variety of color codes.
Border defines the border width of the table. The attribute value is a number.
Bordercolor defines the color of the table border. The attribute value is a variety of color codes.
Cellpadding defines the distance between the cell content and the cell border. The attribute value is a number.
Cellspacing defines the distance between cells in a table
Height defines the height of the table. The attribute value is a number.
Width defines the width of the table. The attribute value is a number.
2. <tr> MARK: A table consists of multiple rows and columns. <tr> mark is used to define a row in a table. Its Attribute attribute value is an attribute value that defines the row in the table, its main attributes and attribute values are as follows:
Align defines alignment, and the attribute value is the same
Background defines the background pattern bgcolor defines the background color
3. <td> mark. Use the content marked with <td> to indicate the elements of the table. Its main attributes are the same as the attribute values and the <table> tag, and the Code for merging two columns and rows is added:
Colspan defines the number of columns in the merged table. The attribute value is a number.
Rowspan defines the number of rows in the merged table. The attribute value is a number.
Common Html code tutorial 5. FRAME
1. Split the window command <frameset> ...... </frameset>
[1] vertical (up and down) segmentation-rows
<Frameset rows = #># number can be used as the number of points:
<Frameset rows = 100,200,300>;
It can also be represented by "*", for example, <frameset rows = *, 500, *>
Percentage: for example, <frameset rows = 30%, 70%>, the sum of each item is preferably 100%;
[2] horizontal (left and right) segmentation-cols <frameset cols = points or percentage>
2. Specify the window content -- <frame>
<Frameset cols = 30%, 70%> <frame> </frameset>
[1] specify the file name of the window -- src <frame src = HTML file name>
[2] define the name of the window -- name
<Frame name = Window name>
[3] set the distance between the file and the upper and lower borders -- marginheight
<Frame marginheight = points>
[4] set the distance between the file and the left and right borders -- marginwidth
<Frame marginwidth = points>
[5] scrolling
<Frame scrolling =#># yes: Fixed Scroll
No: no scroll
Auto: automatically determines the file size and does not require scroll (default value)
[6] Lock the size of the split window-noresize <frame noresize>
Common Html code tutorial 6. Song code:
In this set of code, you don't have to worry about mms. http. rtsp. The following Code applies as long as the suffix is asf, wma, wmv, wmv, and rm:
1. Manual playback:
<EMBED src = song address volume = "100" width = 39 height = 18 hidden = "FALSE" autostart = "fault" type = "audio/x-pn-realaudio-plugin" controls = "PlayButton">
2. Enable automatic playback on the page:
<EMBED src = "song address" width = "39" height = "18" autostart = "true" hidden = "false" loop = "infinite" align = "middle" volume = "100" type = "audio/x-pn-realaudio-plugin" controls = "PlayButton" autostart = "true">
Common Html code tutorial 7. Apply code
<Div align = "center">
<Table border = "1" width = "90%" height = "403" background = "background image address">
<Tr> <td width = "80%" height = "100%">
<P align = "center"> <br>
<Font face = "文" size = "6" color = "# FFFFFF"> song or music name </font> <br>
<P align = "center"> <br>
<Font color = "# FFFFFF" size = 3> introduction </font> <br>
<EMBED style = "FILTER: xray () "src = Music URL width = 250 height = 30 type = audio/x-ms-wma autostart =" true "loop ="-1 "> <br>
</Td> </tr>
</Table>
</Div>
Detailed explanation of simple application code:
<Div align = "center"> defines the center of a post;
<Table border = "1" width = "90%" height = "403" background = "background image address"> <tr> <td width = "80%" height = "100%">
In this example, border = "1" defines the width of the table edge, and defines 0 as an infinite line; width = "90%" height = "403" defines the width and height of the background image table respectively. if the background image is a large image, you can define it as follows: width = Image width height = Image height
<P align = "center"> <br> <font face = "文" size = "6" color = "# FFFFFF"> songs or music name </font> <br>
<P align = "center"> the definition text is centered. <br> the return code is used. A few lines are left blank. <Font face = "文" size = "6" color = "# FFFFFF"> it defines text attributes. Face = "文" is a defined font. You can replace the font with,, and so on. Size = "6" indicates the font size. The larger the number, the default font 2. Color = "# FFFFFF" defines the font color. Code for all font colors has been sent in the wonderful hand area. You can find and change it.
<P align = "center"> <br> <font color = "# FFFFFF"> description </font> <br> <br>
The code in the first bracket still defines that the image and text are centered. Insert the image code. <Font color = "# FFFFFF" size = 3> introduction text </font> defines this text. What if I want to change the font to make it difficult ?? How can I cook an acre of pepper peppers? /Font>
<EMBED style = "FILTER: xray () "src = Music address width = 250 height = 30 type = audio/x-ms-wma autostart =" true "loop ="-1 ">
This section inserts the player code, because I inserted a special player. style = "FILTER: xray ()" is a special code. "Src = Music address" is the address for inserting music files. Width = 250 height = 30 defines the width and height of the player respectively (if you set both width and height to zero, it is hidden and can only be played automatically ). Autostart = "true" loop = "-1" is used to define the music playing mode. autostart = "true" is used to set manual or automatic playback, "true" or "1" indicates automatic playback, "false" or "0" indicates manual playback, and "loop ="-1 "indicates the number of playback times, "true" or "1" indicates repeated playback. "false" "-1" or "0" indicates only one playback.
<Br> </td> </tr> </table> </div> return code and fixed code corresponding to the preceding code.
<EMBED style = "FILTER: xray () "src = Music address width = 250 height = 30 type = audio/x-ms-wma autostart =" true "loop ="-1 ">
This section inserts the player code, because I inserted a special player. style = "FILTER: xray ()" is a special code. "Src = Music address" is the address for inserting music files. Width = 250 height = 30 defines the width and height of the player respectively (if you set both width and height to zero, it is hidden and can only be played automatically ). Autostart = "true" loop = "-1" is used to define the music playing mode. autostart = "true" is used to set manual or automatic playback, "true" or "1" indicates automatic playback, "false" or "0" indicates manual playback, and "loop ="-1 "indicates the number of playback times, "true" or "1" indicates repeated playback. "false" "-1" or "0" indicates only one playback.
<Br> </td> </tr> </table> </div> return code and fixed code corresponding to the preceding code.
Well, the above is the common Html code collected by the Helper's house editor. I hope it will help you.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
