Case 1: hello.html
<html>
<body>
<title>html technology</title>
</body>
<body>
hello
</body>
</html>
Case 2: First html.html
<html>
<head>
<meta charset="utf-8">
<title>HTML technology</title>
</head>
<body>
welcome to html!
</body>
</html>
Case 3: Tags.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Label</title>
</head>
<body text="blue">
Composition of labels
<br>
html From Beginning to Proficiency
<hr>
<h1>Classification of labels</h1>Classification of labels
<hr>
<h2>Classification of labels</h2>
<hr>
<h3>Classification of labels</h3>
<hr>
<h4>Classification of labels</h4>
<hr>
<h5>Classification of labels</h5>
<hr>
<h6>Classification of labels</h6>
<hr>
<span>Ha-ha</span>Hey
</body>
</html>
Case 4: Note.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Notes</title>
</head>
<body>
<h2>welcome to html!</h2>
</body>
</html>
Case 5: Entity Characters.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Document</title>
</head>
<body>
Books:<<HTML From Beginning to Proficiency>>
<hr>
Beijing Shanghai Guangzhou
<hr>
stay HTML use&lt;Express<Less than sign
<hr>
"HTML language"or"HTML language"
<hr>
Copyright©2000-2020 Higher Education Training
<hr>
®Registration Symbol
<hr>
×close button
<hr>
</body>
</html>
Case 6: Common tag br.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Common Labels br</title>
</head>
<body>
HTML From Beginning to Proficiency
<br>
//Welcome to learn HTML Technology
<br>
</body>
</html>
Case 7: Common tag p.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Common tags p</title>
</head>
<body>
<p>HTML Power Hypertext Markup Language.It is an identifying language, which includes a series of tags to unify the format of documents on the network, to link scattered Iternet resources into a descriptive text organized into a logo meal as a whole, and HTML commands to illustrate text, graphics, animations, sounds, tables, links, etc.
</p>
<br>
<p>Hypertext is a way to organize information by associating text charts in text with other information media through a hyperlink method.These interrelated information media may be in the same text, other files, or files of a computer that are geographically distant.This way of organizing information connects information resources distributed in different locations in a random way, which makes it easy for people to find and retrieve information.
</p>
</body>
</html>
Case 8: Common labels h1, h2...h6.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Common Labels h1-h6</title>
</head>
<body>
<h1>Title Level 1</h1>
<h2>Secondary Title</h2>
<h4>Title Level 4</h4>
<h6>Title Level 6</h6>
<hr>
</body>
</html>
Case 9: Common tag pre.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Common Labels pre</title>
</head>
<body>
<pre>
<<HTML From Beginning to Proficiency>>
//Welcome to learn html technology
</pre>
</body>
</html>
Case 10: Common tag div.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Common Labels div</title>
</head>
<body>
<div style="width:400px;height:100px;background:red">Navigation section</div>
<div style="width:500px;height:100px;background:yellow">Body part</div>
<div style="width:600px;height:100px;background:blue">Copyright section</div>
</body>
</html>
Case 11: Common label span.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Common Labels span</title>
</head>
<body>
iphone XR Do not 8888, nor 1888, as long as<span style="font-size: 50px;color: red;">98 element</span>
</body>
</html>
Case 12: Common tags ol, li.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<h3>2020 Year Online Game Charts</h3>
<ol type="a" start="3">
<li>Eat chicken</li>
<li>Glory of Kings</li>
<li>LOL</li>
<li>WOL</li>
</ol>
</body>
</html>
Case 13: Common labels ul, li.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<h3>Dear Classmates</h3>
<ul type="circle">
<li>Gong Jinzheng</li>
<li>Zhang Jinchao</li>
<li>Zhang Yuede</li>
<li>Wang Yao</li>
</ul>
<hr>
</body>
</html>
Case 14: Common tags dl, dt, dd.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Common Labels dl,dt,dd</title>
</head>
<body>
<h3>Interpretation of Terms</h3>
<dl>
<dt>LOL</dt>
<dd>It is an online game proxied by Tencent and named in Chinese by the League of Heroes</dd>
<dd>He is divided into PC End and Move End</dd>
<dt>HTML</dt>
<dd>Is a label for making web pages=Remember Language</dd>
<dt>JAVA</dt>
<dd>Is a cross-platform programming language</dd>
</dl>
</body>
</html>
Case 15: Common tag hr.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Common Labels hr</title>
</head>
<body>
<hr color="#FF7300" size="10px">
<hr color="red">
<hr color="blue" width="400">
<hr color="#00FF00" width="50%">
<div style="width:600px;height:300px;background:#FF7300">
<hr color="red" width="50%" size="9px" align="right">
</div>
</body>
</html>
Case 16: Common tag img.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<img src="..\img\qq.jpg" alt="" title="Picture loading failed.">
<hr>
<div style="width: 800px;height: 800px;background:red">
<img src="..\img\mac.jpg" alt="" width="50%">
<div style="width: 500px;height:500px;background:#cccccc">
<img src="..\img\mac.jpg" alt="" width="50%">
</div>
</div>
<img src="..\img\mac.jpg" alt="" width="50%" >
</body>
</html>
