1. Use HTML for the first time
<title>First use HTML</title> </head> <body> hello，HTML
2. Text processing
<title>text processing </title>
</head>
<body>
<!-- Title -->
<h1>First level title</h1>
<h2>Secondary title</h2>
<h3>Third level title</h3>
<!-- paragraph -->
<p> Hello,HTML</p>
<!-- Ordered list -->
<ol>
<li>one</li>
<li>two</li>
<li>three</li>
</ol>
<!-- Unordered list -->
<ul>
<li>one</li>
<li>two</li>
<li>three</li>
</ul>
<!-- List nesting -->
<!-- Order nesting disorder -->
<ol>
<li>WEB summary</li>
<ul>
<li>WEB Three elements: browser, server APP</li>
<li>Common browsers</li>
<li>HTML working principle</li>
</ul>
</ol>3. Partition elements
<title>Partition element</title>
</head>
<body>
<h1>toolbar</h1>
<div>
<h1>Block elements</h1>
</div>
<div style="color: red;">
<p>Content of the first paragraph</p>
<p>Content of the second paragraph</p>
<p>Content of the third paragraph</p>
</div>
<div>
<p>Copyright logo</p>
</div>4. In line elements
< title > in line elements < / Title >
</head>
<body>
<!-- span -->
<p>
Floor 5, block B, Communication Industrial Park, No.28, Jingkai Fifth Avenue
</p>
<!-- i/em -->
<p>
No.26, 15th Street, South 3rd Ring Road
</p>
<!-- b/strong -->
<p>
<b>Floor 2 and 3, block a, Zhiyou group, No.26, 15th Street, South 3rd Ring Road
</p>
<!-- del/u -->
<p>
Floor 2 and 3, block a, Zhiyou group, No.26, 15th Street, South 3rd Ring Road
</p>
<! -- space collapse -- >
<p>No.26, 15th Street, South 3rd Ring Road, Henan Province;
Floor 2 and 3, block A, Zhiyou group
</p>
<! -- line feed br -- >
<p>
Floor 2 and 3, block A, Zhiyou group, 26 < br > 15th Street, South 3rd Ring Road, Henan Province</br>
</p>
<! -- Entity replacement & lt greater than sign & gt less than sign -- >
<p>
Floor 2 and 3, block a, Zhiyou group, No.26, 15th Street, South 3rd Ring Road, Henan Province
</p>5. Images and hyperlinks
<title>Images and hyperlinks</title>
</head>
<body>
<!-- Connect to anchor -->
<a href="#Button "> to bottom</a>
<!-- picture -->
<p>
<img alt="The picture is hanging" src="E:\Duty\3.jpg" width="500">
</p>
<!-- Hyperlinks target="_blank"Another page self oneself-->
<p><a href="http://Www.baidu.com "target =" _blank "> Baidu</a></p>
<p><a href="http://Www.baidu.com "target =" \\\\\\\\</a></p>
<!-- Virtual some data, scroll bar appears for the page -->
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<p>hello</p>
<!-- Defining anchors -->
<p>
<a name="button">bottom</a>
</p>
<!-- Anchor at top of document by default -->
<p><a href="#"> back to top</a></p>6. Form
<title>form</title>
</head>
<body>
<!-- form -->
<table border="1" >
<tr>
<td>First row first column</td>
<td>First row second column</td>
</tr>
<tr>
<td>Second row first column</td>
<td>Second row second column</td>
</tr>
</table>
<br>
<!-- enjambment -->
<table border="1" width="20%">
<tr>
<td rowspan="2">aaa</td>
<td>bbb</td>
</tr>
<tr>
<td>ddd</td>
</tr>
</table>
<br>
<br>
<!--Cross column -->
<table border="1" width="20%">
<tr>
<td colspan="2">aaa</td>
</tr>
<tr>
<td>ccc</td>
<td>ddd</td>
</tr>
</table>
<!-- Row grouping -->
<table border="1" width="30px">
<thead>
<tr>
<th>number</th><th>name</th><th>amount of money</th>
</tr>
</thead>
<tbody style="color: red;">
<tr>
<td>001</td><td>mouse</td><td>50</td>
</tr>
<tr>
<td>002</td><td>keyboard</td><td>100</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="2">total</td><td>150</td>
</tr>
</table>7. Form
<title>form </title>
</head>
<body>
<!-- Text box, password box, radio box, check box, button, file selection box
Hidden box, other elements: label, text field, drop-down -->
<form >
<h1>form </h1>
<!-- Text box, password box -->
<p>
<label for="user_name">account number:</label>
<input type="text" id="user_name"/>
</p>
<p>
<label for="password">Password:</label>
<input type="password" id="password"/>
</p>
<!-- Radio -->
<p>
<label for="male">male</label>
<input type="radio" name="sex" id="male"/>
<label for="female">female</label>
<input type="radio" name="sex" id="female"/>
</p>
<!-- check box -->
<p>
Hobbies:
<label for="basketball">Basketball</label>
<input type="checkbox" name="favorites" id="basketball">
<label for="football">Football</label>
<input type="checkbox" name="favorites" id="football">
<label for="pingpang">Table Tennis</label>
<input type="checkbox" name="favorites" id="pingpang">
</p>
<!-- Button -->
<p>
<input type="submit" value="Submit">
<input type="reset" value="Reset">
<input type="button" value="cancel">
</p>
<!-- Hide fields and file selection boxes -->
<p>
<input type="hidden" value="9">
<label type="file" >Upload:</label>
<input type="file" id="file">
</p>
<!-- Text field -->
<p>
<label for="address">address</label>
<textarea rows="5" cols="30" id="address">
cxfygvlhbjnkm;l'
.'xdfycuvbuonipomp[l[f ;ml;fhg]]
cxfrygvuhbjnm,.
]
cfvbuonipmo[p,[]]
</textarea>
</p>
<!-- Drop down -->
<label for="course">curriculum</label>
<select>
<option value="1">Java</option>
<option value="2">PHP</option>
<option value="3">Python</option>
</select>
</form>