HTML文档采用目录树这样一种结构，基本结构如：
<!DOCTYPE html><html><head><title>文档的标题</title></head><body>文档的内容......</body></html>第一行声明浏览器要以标准模式解析该文档，根标签是<html></html>，有两个子标签，<head></head>头部不在网页内容中显示，主要用途是描述网页的信息， <body></body>中的内容将在网页中显示，这是一种固定的格式。
如下HTML文档将介绍基本HTML标签的使用：
<!doctype html> <!--声明浏览器要以标准模式解析该html页面 --><html lang="en"> <head> ?<meta charset="UTF-8"> <!-- 编码方式--> ?<meta name="Generator" content="EditPlus?"> ?<meta name="Author" content=""> ?<meta name="Keywords" content=""> <!--content属性后面接自己定义的一些关键字，便于浏览器搜索 --> ?<meta name="Description" content=""> <!-- 对网页的描述信息，--> ?<!-- http-equiv="Refrash" refrash属性后面呢接content="2;http://www.baidu.com/"表示两秒过后跳转到百度首页 --> ?<meta http-equiv="Refresh" content="2;http://www.baidu.com/"> ?<link rel="icon" href="https://www.baidu.com/favicon.ico"><!-- 引用了百度的logo--> ?<!-- 表示网页的标题--> ?<title>html常用标签使用</title> </head> <body> ??<!-- h1~h6 从大到小显示标题,有占行，隔行效果 属于块级标签--> ??<h1>标题1</h1> ??<h2>标题2</h2> ??<!--段落标签，有占行、隔行的效果，也属于块级标签--> ??<p>仰天大笑出门去，我辈岂是蓬蒿人</p> ??<!-- 字体倾斜标签 ,内联标签--> ??<em>多线程编程</em><br/><!换行标签，属于单标签--> ??<!-- 字体加粗，内联标签 --> ??<b> Django框架</b> ??<!--删除标签--> ??<del>你大爷的</del> ??<!--上标，下标标签，内联标签--> ??a<sup>2</sup> ??H<sub>2</sub>O ??<!--关于显示图片的标签, ?属于内联标签，src属性值是图片URL地址，宽高各位200px,500px(像素)，alt属性表示当图片不能加载后显示描述信息 title值表示当鼠标指向该图片后提示内容--> ??<img src="pictures\1.jpg" height="300px" width="200px" alt="加载失败" title="V先生"> ??<!--a标签是内联标签，使用方法一，作为连接跳转，target="_blank"表示新建一个标签页--> ??<a href="http://www.baidu.com/" target="_blank">百度</a> ??<!--使用方法二，作为锚点，在本页面进行跳转，结合以下例子，在网页底部定义一个a锚点标签，点击后会跳转到p标签所在的地方--> ??<p id="top">网页顶部</p> ?????<div style="width:200px;height:700px;background:gray;"></div> ??<a href="#top">到网页顶部</a> ??<!--关于列表的使用，ol有序列表,ul无序列表,dl，自定义列表，属于块级标签 了解即可--> ??<ol> ????<li>列表</li> ????<li>列表</li> ????<li>列表</li> ??</ol> ??<ul> ??<li>列表</li> ??<li>列表</li> ??<li>列表</li> ??<li>列表</li> ??</ul> ??<dl> ??<dt>列表标题</dt> ??<dd>列表</dd> ??<dd>列表</dd> ??<dd>列表</dd> ??</dl> ??<!--表格的使用--> ??<!--table属性中，width，height给表格加限制宽高，border=“1px”给表格加边框，默认是没有的，align="center"让表格居中显示，cellspacing表示单元格与单元格之间的距离，cellpadding表示单元格边框与内容之间的距离--> ??<table width="200px" height="200px" border="1px" align="center" cellspacing="0px" cellpadding="4px"> ??<!--caption属性表示表格的标题名字--> ?????<caption>成绩</caption> ?????<tr> ???????<th>语文</th> <!--th标签与td标签相比可以让内容居中显示并且加粗--> ???????<th>数学</th> ???????<th>英语</th> ?????</tr> ?????<tr> ?????<td rowspan="2">jkj</td> ?<!--rowspan属性让该标签独占两行,rowspan可以让该标签独占两列--> ?????<td colspan="2" align="center">jkj</td> ?????</tr> ?????<tr> ?????<td>kjk</td> ?????<td>kjk</td> ?????</tr> ???</table> ?<!--form表单的使用,action属性表示提交到表单信息到那个URL，method表示提交方式--> ?<form action="" method="post"> ?<!--input标签属于内联标签，我们可以用p标签包含该input标签表现出块级标签的效果,不同 ?的type属性值会展现出不同的效果，由于是以键值对的方式提交的服务器，name值表示键，value属性值会根据type类型表示该值--> ?<p>用户名<input type="text" name="username"></p> ?<p>密码<input type="password" name="psword"></p> ?<br> ?<!--复选框--> ?爱好: ?篮球<input type="checkbox" name="hobby" value="basketball"> ?足球<input type="checkbox" name="hobby" value="football"> ?其他游戏<input type="checkbox" name="hobby" value="playgame"> ?<br><br> ?<!--单选框--> ?男<input type="radio" name="sex" value="male"> ?女<input type="radio" name="sex" value="female"> ?<!--下拉框--> ?<br>所在城市 ?<select name="city"> ???<option value="山西">山西</option> ???<option value="河北">河北</option> ???<option value="河北">河北</option> ???<option value="河北">河北</option> ?</select><hr><!--hr标签表示分割线--> ?<!-- label标签与input标签结合起来使用--> ?<label for="text">姓名</label> ?<input id="text" type="text" name="name"><br> ?<!--表单内容重置,value值表示重置按钮的值，也就是我们看到的值--> ?<input type="reset" value="reset"><br> ?<!--提交按钮--> ?<input type="submit"> ?</form> </body></html>常用特殊符号在HTML文档中的表示方法;
表示一个空格 ???????????< ??> ?表示<> ???????????© ??表示商标商标符号HTML常用标签
原文地址：https://www.cnblogs.com/CaseyWei/p/9337596.html