HTML Tutorial: Collection of commonly used HTML tags (6)

HTML Tutorial: Collection of commonly used HTML tags (6)

These introduced HTML tags do not necessarily fully conform to the XHTML specification. You should make some choices when making actual layout, for example: the B tag and the FONT tag are not in compliance with the XHTML specification.
Related articles: Beginners learn some HTML tags (5)
These introduced HTML tags do not necessarily fully conform to the XHTML specification. You should make some choices when making actual layout, for example: the B tag and the FONT tag are not in compliance with the XHTML specification.
1. Basic TAG elements
--------------------------------------------------------------------------
File format <HTML></HTML> (beginning and end of HTML file)
Title <TITLE></TITLE> (Must be placed in the header section)
Header section <HEAD></HEAD> (description of the document, such as "subject")
Body section <BODY></BODY> (where the content is located)
2. Structural elements
--------------------------------------------------------------------------
Title <H?></H?> (There are six types: H1, H2, H3, H4, H5, H6)
Title alignment <H? ALIGN=LEFT|CENTER|RIGHT></H?>
Section <DIV></DIV>
Section alignment <DIV ALIGN=LEFT|RIGHT|CENTER></DIV>
Short quotes <Q> and </Q>
Yes for some referenced files, if the referenced part is not long. Then you can consider using this tag, which is the new syntax of HTML3.0.
Citation section
<BLOCKQUOTE></BLOCKQUOTE> (usually indented when displayed) blockquote is used to indicate that the document in the area is quoting a person or information in a document. Usually quoted text is quoted using <BLOCKQUOTE> and
</BLOCKQUOTE> to mark them. Then most browsers will represent it in another way when reading these words. This is just to remind readers that this is a quote from someone else.
Emphasis <EM></EM> (usually in italics)
Strong emphasis <STRONG></STRONG> (usually in bold) This character is STRONG, which is similar to
EM is just a way of strengthening the tone of speech. Most browsers use bold font to indicate words marked with <STRONG> and </STRONG>.
Citation statement <CITE></CITE> (usually in italics) Use <CITE> and </CITE> to mark the words quoted by others Program source code <CODE></CODE> If the reader is writing something about computers, then CODE
This tag marks some related words together. The way of using it is to mark the related words with <CODE> and </CODE>.
Program output sample <SAMP></SAMP> is not modified in HTML. If you want to print HTML
The syntax of . Then readers may need to use some special techniques to print these characters. Outside of these characters, readers can use SAMP
This symbol marks them. The characteristic of this tag is that the marked text will be represented by a fixed width.
Keyboard input <KBD></KBD> The KBD tag is usually used to tell the reader which words can be typed. These are marked as
KBD characters are usually represented in fixed-width bold font. But some browsers only use fixed-width characters.
Program variables <VAR></VAR> For some words that may change, HTML provides a
It is displayed with the VAR tag, which is meant for variables or words that may be easily changed. You can use <VAR> and
<VAR> to mark them. This serves to alert the user that these variables may be subject to change.
Define <DFN></DFN> (some browsers do not have this function) If the reader in HTML
The words used in it are some definitions. Then readers can consider using the DFN label. If the reader uses Mosaic browser. Then <DFN> and
The text marked by </DFN> will be shown in italics. Other browsers may not.
Author address <ADDRESS></ADDRESS>
Big font <BIG></BIG>
Small font <SMALL></SMALL>
Language <LANG>
If more than two languages ​​are used in a document, <LANG> and </LANG> can be used to mark them. This is also the new syntax of HTML3.0.
Author (AU)
<AU> and </AU> do not represent general AU files. This tag is used in readers' articles. If certain authors are mentioned, they can be marked with a tag. This is also
HTML 3.0 is a tag specially designed for authors.
personal
(PERSON) In many indexing programs, the program sometimes displays some information pages, and when displaying these information pages. If any individual names are mentioned. Then you can use
<PERSON> and </PERSON> to mark these names. This syntax is also a new syntax added in HTML 3.0.
A word composed of several words (ACRONYM)
In English, some words are composed of several words. If you encounter this kind of word, you can consider using <ACRONYM> and
The </ACRONYM> tags enclose them in special brackets. Although this is a new syntax in HTML3.0. But for those of us who use Chinese, such a grammar is not very helpful.
Abbreviation (ABBREV) Like ACRONYM, there are many abbreviations in English. HTML 3.0
A new tag is also specially created for these abbreviations. This new tag is called <ABBREV> and of course it also has an ending symbol called </ABBREV>.
Insert (INS) In HTML files, if you want to insert a word into an existing file, you can consider using <INS> and
</INS> to mark these words. This will make it easier for readers to know whether the document has been revised when they check it. Of course, this syntax is also HTML 3.0
New syntax added in .
The syntax of delete (DEL) is used to tell the reader that certain words or some parts related to deletion are going to be deleted. This new tag also appeared in HTML3.0.
3. TAG elements related to display mode
--------------------------------------------------------------------------
Bold
Italic<I></I>
Draw underline <U></U> (some browsers do not have this feature)
Strikethrough <STRIKE></STRIKE> (some browsers do not have this feature)
Delete line <S></S> (some browsers do not have this function)
Subscript word <SUB></SUB>
Superscript <SUP></SUP>
Typewriter font <TT></TT> (a font in which space characters have the same width as other text elements)
According to the preset format <PRE></PRE> (keep the relative position between the characters)
Preformatted width <PRE WIDTH=?></PRE> (in characters)
Center <CENTER></CENTER> (text and graphics will be centered)
Flash<BLINK></BLINK>
Font size <FONT SIZE=?></FONT> (from 1 to 7)
Change font size <FONT SIZE=" |-?"></FONT>
Base font size <BASEFONT SIZE=?> (default value is 3)
Font color <FONT COLOR="#$$$$$$"></FONT>
Specify font style <FONT FACE="***"></FONT>
Multiple columns <MULTICOL COLS=?></MULTICOL>
Column text and edge spacing <MULTICOL GUTTER=?></MULTICOL> (default value is 10 pixels)
Column width <MULTICOL WIDTH=?></MULTICOL>
Leave space <SPACER>
Spacing type <SPACER TYPE=horizontal| vertical|block>
Spacing size <SPACER SIZE=?>
Spacing size <SPACER WIDTH=? HEIGHT=?>
Spacing<SPACER ALIGN=left|right|center>
4. Hypertext links and graphic elements
--------------------------------------------------------------------------
Link to a specific URL <A HREF="URL"></A>
Link to anchor <A HREF="URL#***"></A> (anchor in another document)
<A HREF="#***"></A> (anchor in the same document)
Link to the specified FRAME <A HREF="URL"
TARGET="***|_blank|_self|_parent|_top"></A>
Set "anchor point" <A NAME="***"></A>
Forward link <A REL="***"></A> (some browsers do not have this function)
Reverse link <A REV="***"></A> (some browsers do not have this function)
Display Graphics <IMG SRC="URL">
Graphics position <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT>
Graphics location <IMG SRC="URL" ALIGN=TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM>
Alternative graphic text <IMG SRC="URL" ALT="***"> (text to display if the graphic cannot be displayed)
You can click on the graphic <IMG SRC="URL" ISMAP> (need to be used with the .map file)
Clients can click on the graphic <IMG SRC="URL" USEMAP="URL">
Click the map name <MAP NAME="***"></MAP>
Specify a clickable area <AREA SHAPE="RECT" COORDS=",,," HREF="URL"|NOHREF>
Graphics size <IMG SRC="URL" WIDTH=? HEIGHT=?> (in pixels) describes the width and height of the graphic display.
Border size <IMG SRC="URL" BORDER=?> (in pixels) The width of the border outside the shape.
White space around <IMG SRC="URL" HSPACE=? VSPACE=?> (in pixels)
vspace, hspace describe the vertical and horizontal spacing of graphics and text.
Low resolution graphics <IMG SRC="URL" LOWSRC="URL"> Client-side scheduled updates <META
HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">
Plug-in object <EMBED SRC="URL"> (add a plug-in object to a document)
Object size <EMBED SRC="URL" WIDTH=? HEIGHT=?>
5. Divide paragraphs into TAG elements
--------------------------------------------------------------------------
Paragraph <P></P> (the closing tag </p> can usually be omitted)
Specify text alignment <P ALIGN=LEFT|CENTER|RIGHT></P>
Force line break<BR>
Specify the starting point after line break <BR CLEAR=LEFT|RIGHT|ALL>
Horizontal line <HR>
Horizontal line position <HR ALIGN=LEFT|RIGHT|CENTER>
Horizontal line thickness (downward) <HR SIZE=?> (in pixels)
Horizontal line length (right) <HR WIDTH=?> (in pixels)
Horizontal rule ratio width <HR WIDTH="%"> (percentage of page width)
Solid line <HR NOSHADE> (no 3D effect)
No line break<NOBR></NOBR>
Line break <WBR> (You can break the line here if necessary)
6. List element <list>
--------------------------------------------------------------------------
Unordered list <UL><LI></UL>
UL COMPACT
Header symbol type <UL TYPE=DISC|CIRCLE|SQUARE> (for all enumeration items)
<LI TYPE=DISC|CIRCLE|SQUARE> (this item and the following items)
Ordered List<OL><LI></OL>
COMPACT
Numeric type <OL TYPE=A|a|I|i|1> (for all enumeration items)
<LI TYPE=A|a|I|i|1> (this item and the following items)
Starting number <OL START=?> (for all enumeration items)
<LI VALUE=?> (this item and the following items)
Definition list <DL><DT><DD></DL> (<DT>=definition item, <DD>=definition content)
DL COMPACT
Menu-style enumeration <MENU><LI></MENU> (<LI> is placed before each enumeration item)
Simplify <MENU COMPACT></MENU>
Directory listing <DIR><LI></DIR> (<LI> is placed before each listing item)
Simplify <DIR COMPACT></DIR>
7. Background and color tag elements
--------------------------------------------------------------------------
Background pattern <BODY BACKGROUND="URL">
Background Color<BODY BGCOLOR="#$$$$$$">
Text color <BODY TEXT="#$$$$$$">
Unconnected point color<BODY LINK="#$$$$$$">
Color of the connected points<BODY VLINK="#$$$$$$">
Color of positive link point<BODY ALINK="#$$$$$$">
8. Special character replacement (the following replacement marks must be lowercase)
--------------------------------------------------------------------------
Special characters &#?; (? is ISO 8859-1 code)
< <
> >
& &
" "
Registered TM ?
Copyright ?
Non-Breaking Space
9. Mathematical equations
--------------------------------------------------------------------------
Example 1:
<math>
H(s)=∫<sub>0</sub><sup>∞
</sup>e<sup>st</sup>h(t)dt
</math>
Example 2:
<math>
C<box>dV<sub>out</sub>
<over>dt</box>=I<sub>b</sub>
&tanh;(<box>κ(V<sub>in
</sub>-V<sub>out</sub>)<over>2</box>
CdVoutdt=Ib &tanh;(κ(Vin-Vout)2
Example 3:
<math>
(<array align="C"><item>
&ldet;<array align="cc">
<item>x<sub>11</sub>
<item>x<sub>12</sub>
<item>x<sub>21</sub>
<item>x<sub>22</sub>
<array><rd>&rdet;
<item>y<item>z
</array>)</math> ,
From these three examples we can see:
We use &int to represent the "integral symbol", <sub> to represent a subscript, and <sup> to represent a superscript;
<box> is used to indicate that the following items will be considered as a group; <over> represents a division sign. <array> to process the matrix symbol, <array
align=C|L|R> Position of table items in center, left, or right. Items are indicated by adding <item> in front of the data. &Ldet represents the left side of the determinant, and &Rdet represents the right side of the determinant.
(Carriage Return Line Feed) <br>
(Space character)
& (AND symbol) &
< (left angle bracket, less than sign) <
> (right angle bracket, greater than sign) >
° (degrees) °
? (separator) •
′ ´
" "
“ “
” ”
‰ ‰
← ←
↑ ↑
→ →
↓ ↓
? ↔
√ √
∝ ∝
∞ ∞
∠ ∠
∧ ∧
∨ ∨
∩ ∩
∪ ∪
? Ø
∫ ∫
∴ ∴
≈ ≈
¥(RMB) ¥
≠ ≠
≡ ≡
≤ ≤
≥ ≥
⊕ ⊕
λ λ
μ μ
ν ν
ξ ξ
ν ν
ξ ξ
∏ ∏
∑ ∑
¥ ¥
… …
1 (power symbol) ¹
2 (square symbol) ²
3 (cubic symbol) ³
(Superscript case) n<sup>r</sup>
(Subscript case) C<sub>i</sub>
Bold<b>Bold</b>
italic<i>italic</i>
Underline <u>Underline</u>
± (plus and minus signs) ±
× (multiplication symbol) ×
÷ (division symbol) ÷
? (Copyright) ©
?(Registered Trademark) ®
? (trademark symbol) ™
— (dash) —

<<:  The difference and advantages and disadvantages of Mysql primary key UUID and auto-increment primary key

>>:  Detailed explanation of how to use Teleport, a built-in component of Vue3

Recommend

Detailed explanation of CSS margin collapsing

Previous This is a classic old question. Since a ...

React+ts realizes secondary linkage effect

This article shares the specific code of React+ts...

Detailed explanation of the principle of creating tomcat in Eclipse

When creating a tomcat server on a local eclipse,...

Introduction to who command examples in Linux

About who Displays users logged into the system. ...

Detailed usage of docker-maven-plugin

Table of contents Docker-Maven-Plugin Maven plugi...

CSS to achieve the small sharp corner effect of bubbles

Effect picture (the border color is too light, pu...

Implementation of MySQL custom list sorting by specified field

Problem Description As we all know, the SQL to so...

How to remotely log in to the MySql database?

Introduction: Sometimes, in order to develop a pr...

Super simple qps statistics method (recommended)

Statistics of QPS values ​​in the last N seconds ...

Select does not support double click dbclick event

XML/HTML CodeCopy content to clipboard < div c...

Vue implements the magnifying glass effect of tab switching

This article example shares the specific code of ...

js to achieve sliding carousel effect

This article shares the specific code of js to ac...

MySQL million-level data paging query optimization solution

When there are tens of thousands of records in th...