HTML - 图1

1 标签大全

HTML标签或属性 英文全称 中文释义
a Anchor 锚
abbr Abbreviation 缩写词
acronym Acronym 取首字母的缩写词
address Address 地址
dfn Defines a Definition Term 定义定义条目
kbd Keyboard 键盘（文本）
samp Sample 示例（文本
var Variable 变量（文本）
tt Teletype 打印机（文本）
code Code 源代码（文本）
pre Preformatted 预定义格式（文本 ）
blockquote Block Quotation 区块引用语
cite Citation 引用
q Quotation 引用语
strong Strong 加重（文本）
em Emphasized 加重（文本）
b Bold 粗体（文本）
i Italic 斜体（文本）
big Big 变大（文本）
small Small 变小（文本）
sup Superscripted 上标（文本）
sub Subscripted 下标（文本）
bdo Direction of Text Display 文本显示方向
br Break 换行
center Centered 居中（文本）
font Font 字体
u Underlined 下划线（文本）
s/ strike Strikethrough 删除线
div Division 分隔
span Span 范围
ol Ordered List 排序列表
ul Unordered List 不排序列表
li List Item 列表项目
dl Definition List 定义列表
dt Definition Term 定义术语
dd Definition Description 定义描述
del Deleted 删除（的文本）
ins Inserted 插入（的文本）
h1~h6 Header 1 to Header 6 标题1到标题6
p Paragraph 段落
hr Horizontal Rule 水平尺
href hypertext reference 超文本引用
alt alter 替用(一般是图片显示不出的提示)
src Source 源文件链接
cell cell 巢
cellpadding cellpadding 巢补白
cellspacing cellspacing 巢空间
nl navigation lists 导航列表
tr table row 表格中的一行
th table header cell 表格中的表头
td table data cell 表格中的一个单元格
iframe Inline frame 定义内联框架
optgroup Option group 定义选项组
TML标签 英文全称 中文释义
a Anchor 锚
abbr Abbreviation 缩写词
acronym Acronym 取首字母的缩写词
address Address 地址
dfn Defines a Definition Term 定义定义条目
kbd Keyboard 键盘（文本）
samp Sample 示例（文本
var Variable 变量（文本）
tt Teletype 打印机（文本）
code Code 源代码（文本）
pre Preformatted 预定义格式（文本 ）
blockquote Block Quotation 区块引用语
cite Citation 引用
q Quotation 引用语
strong Strong 加重（文本）
em Emphasized 加重（文本）
b Bold 粗体（文本）
i Italic 斜体（文本）
big Big 变大（文本）
small Small 变小（文本）
sup Superscripted 上标（文本）
sub Subscripted 下标（文本）
bdo Direction of Text Display 文本显示方向
br Break 换行
center Centered 居中（文本）
font Font 字体
u Underlined 下划线（文本）
s/ strike Strikethrough 删除线
div Division 分隔
span Span 范围
ol Ordered List 排序列表
ul Unordered List 不排序列表
li List Item 列表项目
dl Definition List 定义列表
dt Definition Term 定义术语
dd Definition Description 定义描述
del Deleted 删除（的文本）
ins Inserted 插入（的文本）
h1~h6 Header 1 to Header 6 标题1到标题6
p Paragraph 段落
hr Horizontal Rule 水平尺
href hypertext reference 超文本引用
alt alter 替用(一般是图片显示不出的提示)
src Source 源文件链接
cell cell 巢
cellpadding cellpadding 巢补白
cellspacing cellspacing 巢空间
nl navigation lists 导航列表
tr table row 表格中的一行
th table header cell 表格中的表头
td table data cell 表格中的一个单元格
iframe Inline frame 定义内联框架
optgroup Option group 定义选项组
  Non-Breaking Space 不换行空格

锚点定位 （难点）

1.使用<a href=”#id名>“链接文本"</a>创建链接文本。

2.使用相应的id名标注跳转目标的位置。

2 html简介

2.1 html概述

html全称：Hyper Text Markup Language(超文本标记语言)
超级文本标记语言是标准通用标记语言（SGML）下的一个应用，也是一种规范，一种标准，它通过标记符号来标记要显示的网页中的各个部分。
网页文件本身是一种文本文件，通过在文本文件中添加标记符。
可以告诉浏览器如何显示其中的内容（如：文字如何处理，画面如何安排，图片如何显示等）。
浏览器按顺序阅读网页文件，然后根据标记符解释和显示其标记的内容，对书写出错的标记将不指出其错误，且不停止其解释执行过程，编制者只能通过显示效果来分析出错原因和出错部位。但需要注意的是，对于不同的浏览器，对同一标记符可能会有不完全相同的解释，因而可能会有不同的显示效果。

2.2 html特点

超级文本标记语言文档制作不是很复杂，但功能强大，支持不同数据格式的文件嵌入，这也是万维网（WWW）盛行的原因之一，其主要特点如下：
1 简易性：超级文本标记语言版本升级采用超集方式，从而更加灵活方便。
2 可扩展性：超级文本标记语言的广泛应用带来了加强功能，增加标识符等要求，超级文本标记语言采取子类元素的方式，为系统扩展带来保证。
3 平台无关性：虽然个人计算机大行其道，但使用MAC等其他机器的大有人在，超级文本标记语言可以使用在广泛的平台上，这也是万维网（WWW）盛行的另一个原因。
4 通用性：另外，HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他人浏览到，无论使用的是什么类型的电脑或浏览器。

2.3 html语法规则

  1. <!DOCTYPE html>
  2. <html>
  3.   <head>
  4.     <!--设置页面的字符集编码 -->
  5.     <meta charset="utf-8" />
  6.     <!--设置页面的标题 -->
  7.     <title></title>
  8.   </head>
  9.   <body>
  10.     <!--需要展示的信息-->
  11.   </body>
  12. </html>

1.html结构：包括head body
2.html标签是以尖括号包围的关键字
3.html标签通常是成对出现的，有开始就有结束，包含成对标签、独立标签
4.html通常都有属性，格式:属性名＝“属性值”(多个属性之间空格隔开)
5.html标签不区分大小写,建议小写

3. html基本标签

3.1 结构标签

  1.     <html><html>:根标签         
  2.     <head>：头标签          
  3.      <title></title>:页面的标题       
  4.     </head>      
  5.     <body></body>：主体标签：网页内容
  7. 属性：     
  8.     color:文本的颜色 <font color="red">内容</font>
  9.     bgcolor:背景色     <body bgcolor="bisque"> </body>
  10.     background:背景图片              
  11. 颜色的表示方式：                        
  12.     第一种方式：使用颜色名称: red green blue                 
  13.     第二种方式：RGB模式 #000000  #ffffff  #325687   #377405

3.2 排版标签

  1.     1.注释标签：<!--注释-->                
  2.     2.换行标签：<br/>           
  3.     3.段落标签：<p>文本文字</p>   
  4.           特点：段与段之间有行高                         
  5.           属性：align对齐方式  (left：左对齐   center：居中  right：右对齐)          
  6.     4.水平线标签:<hr/>                      
  7.           属性:   
  8.               width：水平线的长度(两种:第一种:像素表示；第二种，百分比表示)                                       size: 水平线的粗细 (像素表示，例如：10px)                                 
  9.               color:水平线的颜色                                  
  10.               align:水平线的对齐方式(left：左对齐   center：居中  right：右对齐)

3.3 容器标签

  1.    <div></div>:块级标签，独占一行，换行
  2.    <span></span>:行级标签，所有内容都在同一行
  3.          作用：   <div></div>:主要是结合css页面分块布局
  4.                   <span></span>:进行友好提示信息,对行内的元素进行单独控制

3.4 文字标签

3.4.1 基本文字标签

  1.     <font></font> 
  2.        属性： size:设置字体大小
  3.              color:设置字体颜色
  4.              face:设置字体

3.4.2 标题标签

  1.  <h1></h1>—-<h6></h6>  
  2.  随着数字增大文字逐渐变小，字体是加粗的，内置字号，默认占据一行；

3.5 列表标签

3.5.1 无序列表

ul

  1.    无序列表标签： <ul></ul>
  2.              属性：type :三个值，分别为
  3.                   circle(空心圆) ,disc(默认,实心圆),square(黑色方块)
  4.          列表项：<li></li>
  6.    示例如下：  
  7.         <ul type="square">无序列表
  8.             <li>苹果</li>
  9.             <li>香蕉</li>
  10.             <li>橘子</li>
  11.         </ul>

3.5.2 有序列表

ol

  1.       有序列表标签：<ol></ol>
  2.              属性：type：1、A、a、I、i（数字、字母、罗马数字）
  3.              列表项： <li></li>
  4.       示例如下：
  5.         <ol type="I">有序列表
  6.             <li>苹果</li>
  7.             <li>香蕉</li>
  8.             <li>橘子</li>
  9.         </ol>

3.5.3 定义列表

dl

  1.  定义列表   <dl>
  2.                 <dt>苹果</dt>
  3.                 <dd>苹果是一种水果，富含维生素C，美容养颜，吃了长寿....</dd>
  4.            </dl>

3.5.4 列表嵌套

  1. <ul>
  2.     <li>咖啡</li>
  3.         <li>茶
  4.             <ul>
  5.                 <li>红茶</li>
  6.                 <li>绿茶
  7.                     <ul>
  8.                         <li>中国茶</li>
  9.                         <li>非洲茶</li>
  10.                     </ul>
  11.                 </li>
  12.             </ul>
  13.         </li>
  14.     <li>牛奶</li>
  15. </ul>

3.6 图片标签

  1.  <img/>独立标签   
  2.   属性: 
  3.       src：图片地址： 相对路径 （同一个网站）  绝对路径 （不同网站）
  4.       width:宽度
  5.       height:高度
  6.       border:边框
  7.       align:对齐方式，代表图片与相邻的文本的相当位置（有三个属性值：top middle bottom）
  8.       alt:图片的文字说明
  9.       hspace 和 vspace 设定图片边沿上下左右空白，以免文字或其它图片过于贴近

3.7 链接标签

  1.  超链接可以是文本，也可以是一幅图像，您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。
  3. <a>文本或图片</a>
  4. 属性： 
  5.     href:跳转页面的地址(跳转到外网需要添加协议)；            
  6.     name:名称，锚点(回到锚点: 顶部，底部，中间)，在访问锚点的书写格式:#name的值                        target:_self(自己)  _blank(新页面，之前页面存在)  _parent  _top  默认_self
  7.           _search相等于给页面起一个名字，如果再次打开时，如果页面存在，则不再打开新的页面。可以是任意名字。

3.8 表格标签

  1. 表格由<table>标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

3.8.1 普通表格

(table,tr,td)

  1.  <!--border:边框的宽度 bordercolor:边框的颜色 cellspacing:单元格的边距 width:宽度 height:高度-->
  2.         <table border="1" bordercolor="red" cellspacing="0" align="center" width="200" height="100">
  3.             <tr>
  4.                 <td>学号</td>
  5.                 <td>姓名</td>
  6.             </tr>
  7.             <tr>
  8.                 <td>1</td>
  9.                 <td>aa</td>
  10.             </tr>
  11.         </table>

3.8.2 表格的表头

(th)

  1.   <table border="1" bordercolor="red" cellspacing="0" align="center">
  2.                 <caption>学生表</caption>
  3.                 <tr>
  4.                     <th>学号</th>
  5.                     <th>姓名</th>
  6.                 </tr>
  7.                 <tr>
  8.                     <td>1</td>
  9.                     <td>aa</td>
  10.                 </tr>
  11.         </table>

3.8.3 表格的列合并

colspan 属性

  1. <table border="1" bordercolor="red" cellspacing="0" align="center">
  2.                 <tr>
  3.                     <td colspan="4" align="center">学生表</td>
  4.                 </tr>
  5.                 <tr>
  6.                     <td>学号</td>
  7.                     <td>姓名</td>
  8.                     <td colspan="2">各科成绩</td>
  9.                 </tr>
  10.                 <tr>
  11.                     <td>1</td>
  12.                     <td>aa</td>
  13.                     <td>80</td>
  14.                     <td>90</td>
  15.                 </tr>
  16.         </table>

3.8.4 表格的行合并

rowspan属性

  1. <table border="1" bordercolor="red" cellspacing="0" align="center">
  2.             <tr>
  3.             <td colspan="4" align="center">学生表</td>
  4.             </tr>
  5.             <tr>
  6.                 <td>学号</td>
  7.                 <td>姓名</td>
  8.                 <td>语文成绩</td>
  9.                 <td>数学成绩</td>
  10.             </tr>
  11.             <tr>
  12.                 <td rowspan="2">1</td>
  13.                 <td rowspan="2">aa</td>
  14.                 <td>80</td>
  15.                 <td>90</td>
  16.             </tr>
  17.             <tr>
  18.                 <td>80</td>
  19.                 <td>90</td>
  20.             </tr>
  21. </table>

3.9 文本格式化标签

  1.     <b>     定义粗体文本。
  2.     <big>   定义大号字。
  3.     <em>    定义着重文字。
  4.     <i>     定义斜体字。
  5.     <small>     定义小号字。
  6.     <strong>    定义加重语气。
  7.     <sub>   定义下标字。
  8.     <sup>   定义上标字。
  9.     <ins>   定义插入字。
  10.     <del>   定义删除字。

4. html表单标签

html表单用于收集不同类型的用户输入

4.1 form标签

  1. 常用属性：action：表示动作，值为服务器的地址，把表单的数据提交到该地址上处理
  2.          method:请求方式：get 和post
  3.          enctype:表示是表单提交的类型
  4.                 默认值：application/x-www-form-urlencoded  普通表单
  5.                        multipart/form-data  多部分表单(一般用于文件上传)
  7.      get:
  8.        1.地址栏,请求参数都在地址后拼接 path?name="张三"&password="123456"
  9.        2.不安全
  10.        3.效率高
  11.        4.get请求大小有限制，不同浏览器有不同，但是大约是2KB
  12. 使用情况：一般情况用于查询数据。
  13.      post：
  14.        1.地址栏：请求参数单独处理。
  15.        2.安全可靠
  16.        3.效率低
  17.        4.post请求大小理论上无限。
  18. 使用情况：一般用于插入修改等操作

4.1.1 input标签

  1. type: 以下为type可能要取的值： 
  2.       1.1   text 文本框  输入内容
  3.       1.2   password  密码框   密文或者掩码
  4.       1.3   radio 表示是单选，name必须一致；value：提交给服务器的数据
  5.                   表示同一组中只能选中一个( checked ="checked" 表示选中)
  6.       1.4  checkbox  表示多选 ，name必须一致，
  7.                  表示同一组中可以选多个，返回值是个数组( checked ="checked" 表示选中)
  8.       1.5   file ：表示上传控件                
  9.       以上具有输入性质的必须要有name属性,一开始写value表示是默认值(以后获取输入框的内容要根据name来取)   
  10.      以下按钮不具有输入性质，不需要name属性，但是按钮上的文字提示使用value属性
  11.       1.6 submit   提交
  12.       1.7 reset   重置
  13.       1.9 image   图片提交按钮
  14.      以上所有input的属性： width 设置宽度，height 设置高度  border 设置边框
  15.       1.10 button 普通按钮
  16.       1.11 hidden  表示隐藏域，该框的内容服务器需要，但是不想让用户知道(不想清楚的显示在界面上)
  18. name属性：表单元素名字，只有name属性才能提交给服务器。

4.1.2 select 元素

(下拉列表)

  1. <select name="city">   <!--select标签添加该属性multiple="multiple"表示多选-->  
  2.      <!--option表示下拉列表项-->
  3.     <option value="北京">北京</option> 
  4.      <!--selected="selected"表示选中该项-->
  5.     <option value="上海" selected="selected">上海</option>
  6.     <option value="广州">广州</option>
  7.     <option value="杭州">杭州</option>
  8. </select>

4.1.3 textarea元素

(文本域)

需要指定输入的区域位置大小

  1.  <textarea cols="100" rows="5">  表示5行100列的区域可以输入内容，该元素没有value属性

3.1.4 示例及效果图如下
HTML - 图2

  1. <form action="" method="get">
  2.             <table align="center">
  3.                 <caption>
  4.                     <h1>注册</h1></caption>
  5.                 <tr>
  6.                     <td align="right">用户名：</td>
  7.                     <td><input type="text" name="username" value="bluesky" /></td>
  8.                 </tr>
  9.                 <tr>
  10.                     <td align="right">密码：</td>
  11.                     <td><input type="password" name="password" /></td>
  12.                 </tr>
  13.                 <tr>
  14.                     <td align="right">确认密码：</td>
  15.                     <td><input type="password" name="confirmpwd" /></td>
  16.                 </tr>
  17.                 <tr>
  18.                     <td align="right">性别：</td>
  19.                     <td>
  20.                         <input type="radio" name="sex" value="男" />男
  21.                         <input type="radio" name="sex" value="女" checked="checked" />女
  22.                     </td>
  23.                 </tr>
  24.                 <tr>
  25.                     <td align="right">爱好：</td>
  26.                     <td>
  27.                         <input type="checkbox" name="hobby" value="篮球" checked="checked" />篮球
  28.                         <input type="checkbox" name="hobby" value="足球 " />足球
  29.                         <input type="checkbox" name="hobby" value="乒乓球 " />乒乓球
  30.                         <input type="checkbox" name="hobby" value="羽毛球 " />羽毛球
  31.                     </td>
  32.                 </tr>
  33.                 </tr>
  34.                 <tr>
  35.                     <td align="right">上传头像：</td>
  36.                     <td>
  37.                         <input type="file" name="upload" />
  38.                     </td>
  39.                 </tr>
  40.                 </tr>
  41.                 <tr>
  42.                     <td align="right">居住地：</td>
  43.                     <td>
  44.                         <select name="city">
  45.                             <option value="北京">北京</option>
  46.                             <option value="上海" selected="selected">上海</option>
  47.                             <option value="广州">广州</option>
  48.                             <option value="杭州">杭州</option>
  49.                         </select>
  50.                     </td>
  51.                 </tr>
  52.                 </tr>
  53.                 <tr>
  54.                     <td align="right">个人介绍：</td>
  55.                     <td>
  56.                         <textarea cols="100" rows="5">
  57.                  </textarea>
  58.                     </td>
  59.                 </tr>
  60.                 </tr>
  61.                 <tr>
  62.                     <td></td>
  63.                     <td align="center">
  64.                         <input type="submit" value="注册" />
  65.                         <input type="reset" value="重置" />
  66.                     </td>
  67.                 </tr>
  68.             </table>
  69. </form>

5. html框架标签

  1. 通过使用框架，你可以在同一个浏览器窗口中显示不止一个页面。每份HTML文档称为一个框架，并且每个框架都独立于其他的框架。
  2. 使用框架的坏处：
  3.     开发人员必须同时跟踪更多的HTML文档
  4.     很难打印整张页面

5.1 frameset

框架结构标签

  1. 框架结构标签（<frameset>）定义如何将窗口分割为框架
  2.         每个 frameset 定义了一系列行或列
  3.         rows/columns 的值规定了每行或每列占据屏幕的面积

5.2 frame

框架标签

  1. frame 标签定义了放置在每个框架中的 HTML 文档。

5.3 基本的注意事项

  1. 1. 不能将 <body></body> 标签与 <frameset></frameset> 标签同时使用
  2. 2. 假如一个框架有可见边框，用户可以拖动边框来改变它的大小。为了避免这种情况发生，可以在   <frame> 标签中加入：noresize="noresize"。

5.4 效果图及源代码示例

HTML - 图3

  1. ！--主界面--
  2. <!DOCTYPE html>
  3. <html>
  4.     <head>
  5.         <meta charset="UTF-8">
  6.         <title></title>
  7.     </head>
  8.     <frameset rows="15%,*" border="1px">
  9.         <frame src="FrameTop.html" name="topFrame" noresize="noresize" />
  10.         <frameset cols="15%,*">
  11.             <frame src="FrameLift.html" name="liftFrame" noresize="noresize"/>
  12.             <frame src="FrameRight.html" name="rigthFrame"/>
  13.         </frameset>
  14.     </frameset>
  15. </html>
  17. ！--左侧超链接连接栏--
  18. <!DOCTYPE html>
  19. <html>
  20.     <head>
  21.         <meta charset="UTF-8">
  22.         <title></title>
  23.         <style>a{text-decoration:none}</style>
  24.     </head>
  25.     <body>
  26.         <table width="100%" height="400px">
  27.             <tr align="center" >
  28.                 <td>
  29.                     <a href="a连接.html" target="rigthFrame"><font size="5">第一个连接</font></a>
  30.                 </td>
  31.             </tr>
  32.             <tr align="center" >
  33.                 <td>
  34.                     <a href="Table.html" target="rigthFrame"><font size="5">第二个连接</font></a>
  35.                 </td>
  36.             </tr>
  37.             <tr align="center" >
  38.                 <td>
  39.                     <a href="注册.html" target="rigthFrame"><font size="5">第三个连接</font></a>
  40.                 </td>
  41.             </tr>
  42.             <tr align="center" >
  43.                 <td>
  44.                     <a href="综合案例.html" target="rigthFrame"><font size="5">第四个连接</font></a>
  45.                 </td>
  46.             </tr>
  47.             <tr align="center" >
  48.                 <td>
  49.                     <a href="列表.html" target="rigthFrame"><font size="5">第五个连接</font></a>
  50.                 </td>
  51.             </tr>
  52.         </table>
  53.     </body>
  54. </html>
  56. ！--右侧显示页面--
  57. <!DOCTYPE html>
  58. <html>
  59.     <head>
  60.         <meta charset="UTF-8">
  61.         <title>注册</title>
  62.     </head>
  63.     <body bgcolor="aquamarine">
  64.         <div align="center">
  65.             <form action="" method="post">
  66.             <table>
  67.                 <tr>
  68.                     <th colspan="2">用户注册</th>
  69.                 </tr>
  70.                 <tr>
  71.                     <td>用户名：</td>
  72.                     <td><input type="text" name="uName" /></td>
  73.                 </tr>
  74.                 <tr>
  75.                     <td>密码：</td>
  76.                     <td> <input type="password" name="pwb" /></td>
  77.                 </tr>
  78.                 <tr>
  79.                     <td>确认密码：</td>
  80.                     <td> <input type="password" name="qpwb" /></td>
  81.                 </tr>
  82.                 <tr>
  83.                     <td>性别:</td>
  84.                     <td>
  85.                         <input type="radio" name="gender" checked="checked" value="男" />男
  86.                         &nbsp;&nbsp;&nbsp;
  87.                         <input type="radio" name="gender" value="女" />女
  88.                     </td>
  89.                 </tr>
  90.                 <tr>
  91.                     <td>爱好：</td>
  92.                     <td>
  93.                         <input type="checkbox" name="hobby" value="动漫"/>动漫
  94.                         <input type="checkbox" name="hobby" value="游戏"/>游戏
  95.                         <input type="checkbox" name="hobby" value="社交"/>社交
  96.                     </td>
  97.                 </tr>
  98.                 <tr>
  99.                     <td>所在地</td>
  100.                     <td>
  101.                         <select name="address">
  102.                             <option>北京</option>
  103.                             <option>上海</option>
  104.                             <option>天津</option>
  105.                             <option>广东</option>
  106.                         </select>
  107.                     </td>
  108.                 </tr>
  109.                 <tr>
  110.                     <td>上传头像</td>
  111.                     <td>
  112.                         <input type="file" name="file" />
  113.                     </td>
  114.                 </tr>
  115.                 <tr>
  116.                     <td>自我介绍</td>
  117.                     <td>
  118.                         <textarea style="resize:none; height: 50px;" name="myself"></textarea>
  119.                     </td>
  120.                 </tr>
  121.                 <tr >
  122.                     <td colspan="2">
  123.                         <input style="margin-left: 50px;" type="submit" name="submit"/>
  124.                         <input style="margin-left: 50px;" type="reset" name="reset"/>
  125.                     </td>
  126.                 </tr>
  127.             </table>
  128.         </form>
  130.         </div>
  132.     </body>
  133. </html>
  135. !--顶部Hello World--
  136. <!DOCTYPE html>
  137. <html>
  138.     <head>
  139.         <meta charset="UTF-8">
  140.         <title></title>
  141.     </head>
  142.     <body bgcolor="coral">
  143.         <p align="center"><font size="7">Hello World</font></p>
  144.     </body>
  145. </html>

6. html的其它标签和特殊字符

6.1 其它标签

  1.         <!--该网页的关键字-->
  2.         <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  3.         <!--该网页的描述-->
  4.         <meta http-equiv="description" content="this is my page">
  5.          <!--该网页的编码-->
  6.         <meta http-equiv="content-type" content="text/html; charset=UTF-8">  html4.01
  7.          <meta charset="UTF-8">  html5
  8.         <!-- href：引入css文件的地址-->
  9.         <link rel="stylesheet" type="text/css" href="./styles.css">
  10.         <!--src：js的文件地址-->
  11.         <script type="text/javascript" src=""></script>

6.2 特殊字符

  1.         &lt; 小于号  
  2.         &gt; 大于号
  3.         &amp; 与字符
  4.         &quot; 引号 
  5.         &reg; 己注册
  6.         &copy; 版权
  7.         &trade; 商标
  8.         &nbsp; 空格