Paragraph label
<p>paragraph</p> Exclusive row
Title label
<h1>Title label</h1> <h2>Title label</h2> <h3>Title label</h3> <h4>Title label</h4> <h5>Title label</h5> <h6>Title label</h6>
Common ground: both are bold and block elements
Differences: the font size decreases in turn
Picture label
<img src="" alt="" width="" height="" title="">
src is used to represent the picture introduction path
1. When the HTML file ， and ， picture ， are in the same directory, the src value is ， direct picture name ， or/ Picture name
<img src="1.jpg">
2. When the HTML file ， is in the same directory as the ， folder where the pictures are located ， the value of src is ， write the name of the folder first and then the name of the pictures
<img src="img/2.jpg">
3. When the folder where the HTML file is located is in the same directory as the image, the value of src is to pass first/ Jump out of the current directory and write the name of the picture
<img src="../3.jpg">
4. When the folder where the HTML file is located and the file where the picture is located are in the same directory, the src value is "pass first/ Jump out of the current directory, write the name of the picture folder, and finally write the picture name
<img src="../img/3.jpg">
alt is used to replace the text of the picture when the picture fails to load
height width
title any label can be used. Mouse over the reminder text on the label
Line feed
<br>
Line break marker, used for line breaks within a paragraphList
<ul> <li>List 1</li> <li>List 2</li> </ul> <ol> <li>List 1</li> <li>List 2</li> </ol> <dl> <dt>Indicate the object of a term</dt> <dd>List item description </dd> </dl>
< UL > < / UL > unordered list mark, indicating that the items contained in the list are not in order
< ol > < / OL > ordered list mark indicates that the items contained in the list are in order
< DL > < / dl > definition list
Typesetting
<b>film</b> <strong>film</strong> <i>A quarrel of words</i> <em>A quarrel of words</em> <hr width="" align="" color=""> <small>Small font</small> <sup>Superscript</sup> <sub>subscript</sub>
Bold
< b > content</b>
< strong > content < / strong > keynote table emphasis
Italics
< I > content < / I >
< EM > content < / EM > keynote table emphasis
Horizontal line
<hr width="" align="" color="">
width
align horizontal alignment
Align left
center alignment
Align right
Color changes the color of the horizontal line
Special symbols
< > // "<" and ">" ‹ › // "<" and ">" « » // "And"     // Space © // copyright & &
Hyperlinks
<a href="#"Class =" box "> hyperlink</a> <a href="" target="_blank"></a> //New window opens <a href="" target="_parent"></a> <a href="" target="_search"></a> <a href="" target="_self"></a> <a href="" target="_top"></a>
/* No access status */
.box:link{
color: #FFC0CB;
}
/* Status after access */
.box:visited{
color: #008000;
}
/* Mouse over state */
.box:hover{
color: #FF0000;
}
/* Active state */
.box:active{
color: #0000FF;
}Anchor link
<a id="zj">Chapter III</a> <a href="#zj "> Click to view Chapter 3</a>
Intra line frame
<iframe src="" width="" height="" frameborder="" scrolling=""></iframe>
Frame border frame
frameborder = "1" with border
frameborder = "0" no border
scrolling is OK by default
Auto auto
No no scroll bar
yes there is a scroll bar
Forms
<table border="" align="" bordercolor="" bgcolor="" cellpadding="" cellspacing="" rules=""> <tr> <td></td> </tr> </table>
Border # table border
cellspacing is the distance between cells
cellpadding is the distance between the content and the surrounding cell
Border color
bgcolor background color
align horizontal alignment
Align left
center align
Align right
rules # specifies whether the inner border is visible
none ， no lines
Groups # is the link between row groups and column groups
Rows lines between rows are visible
cols ， visible lines between columns
all ， lines between rows and columns are visible
Merge Table
<table border="1" cellspacing="0" align="center"> <tr> <td colspan="2">Cell</td> <td>Cell</td> <td rowspan="2">Cell</td> </tr> <tr> <td>Cell</td> <td>Cell</td> <td>Cell</td> </tr> <tr> <td colspan="3">Cell</td> <td>Cell</td> </tr> <tr> <td>Cell</td> <td colspan="2">Cell</td> <td>Cell</td> </tr> </table>
merge cell
rowspan up and down merge
colspan ， merge left and right
Form
<form action="" method=""> </form>
form is used to represent the range} block element of the collected data
Action behavior is the path of action data submission
Method data submission method: get post
Distinction
1. The data submitted in get mode will appear above the address bar, which has low security
2. The data that the get method may get is the cache information in the browser
3. The data submitted by get method has length
The maximum length of the reminder text in the placeholder input box is the maximum number of characters entered
Text box
<input type="text" name="" id="" value="" placeholder="user name" maxlength=""/>
Password box
<input type="password" name="" id="" value="" placeholder="password" maxlength=""/>
check box
<input type="checkbox" name="" id="" value="" />
Radio
<input type="radio" name="" id="" value="" />
Hide
<input type=hidden" name="" id="" value="" />
Drop down box
<select name="" id=""> <option value="" selected></option> </select>
Multiline text box
<textarea rows="" cols=""></textarea>
File upload
<input type="file" name="myfile" multiple>
Multiple select multiple files
Submit
<input type="submit" value="Submit" />
Reset
<input type="reset" value="Reset" />
General button
<input type="button" value="General button" />
<button type="button">Normal button</button> <button type="submit">Submit button</button> <button type="reset">Reset button</button>