认识HTML文件

怼烎@ 2021-09-02 04:51 860阅读 0赞

### 文章目录 ###

*  一、什么是HTML
 *   *  1.HTML文件
     *  2.HTML的应用
     *  3.HTML文件的运行
     *  4.创建一份HTML文件
     *  5.修改html文件
     *  6.HTML文件展示效果
 *  二、认识标签
 *   *  1.什么是标签
     *  2.标签的写法
     *  3.标签的作用
 *  三、标签属性
 *   *  1.什么是标签的属性
     *  2.属性的写法
     *  3.属性的作用
 *  四、常用标签详解
 *   *  1.html标签
     *  2.head标签
     *  3.title标签
     *  4.body标签
     *  5.<!doctype html>
     *  6.网页标题小图标标签
     *  7.meta标签
     *  8.图片标签
     *  9.超链接标签
     *  10.文本段落标签
     *  11.文本样式标签
     *  12.滚动标签
     *  13.列表
     *  14.表格
     *   *  14.1表格的结构
         *  14.1 表格的属性
         *  14.2表格的一些操作
     *  15.表单
     *   *  15.1表单的组成
         *  15.2表单的语法
         *  15.3表单的提交（name属性）
     *  16. 控件
     *   *  16.1 控件的语法
         *  16.2下拉列表
         *  16.3多行文本框
 *  五、网页字符集
 *   *  1.特殊字符
 *  六、什么情况下使用哪种标签
 *  七、HTML的注释
 *  八、浏览器
 *   *  1.浏览器介绍
     *  2.url介绍
 *  九、搜索引擎

# 一、什么是HTML #

HTML是 **Hyper Text Markup Language** 的缩写，翻译过来就是超文本标记语言。  
它是一种建立网页文件的语言，通过标记式的指令(Tag)，将影像、声音、图片、文字动画、影视等内容显示出来。

## 1.HTML文件 ##

HTML文件包含了HTML指令代码，这些指令代码并不是一种程序语言，只是一种排版网页中资料显示位置的标记结构语言。  
       通过在HTML文件中添加标记符，即我们所属的标签，可以告诉浏览器如何显示其中的内容（如：文字如何处理，画面如何安排，图片如何显示等）。浏览器按顺序阅读网页文件，然后根据标记符解释和显示其标记的内容。  
       对于写错的标记，浏览器不会报错，我们只能通过显示的效果来分析哪里写错了。  
       对于不同的浏览器，同一标记符可能会有不完全相同的解释，因而可能会有不同的显示效果，现在我们几乎用的都是HTML5版本。  
       一个网页可以有多个HTML文件。

## 2.HTML的应用 ##

HTML的普遍应用就是带来了超文本的技术―通过单击鼠标从一个主题跳转到另一个主题，从一个页面跳转到另一个页面

## 3.HTML文件的运行 ##

HTML文件的运行离不开已经制定好的规则。

①超文本传输协议  
        文本传输协议规定了浏览器在运行HTML文档时所遵循的规则和进行的操作。  
②HTTP协议  
        HTTP协议的制定使浏览器在运行超文本时有了统一的规则和标准。

## 4.创建一份HTML文件 ##

在桌面上右键选择新建→文本文档→将文档名字重名为index.html,index为文件名，html为后缀。后缀名是一定要改为html的。之后文本图标会变成你默认浏览器的图标。双击即可运行这个html文件，但这时候里面是什么都没有。

## 5.修改html文件 ##

右键这个浏览器图标，选择打开方式为文本或者 编辑器。进入这个文件，如果使用的编辑器，可以百度快捷生成html文件的快捷键，或者手写如下代码。

一份HTML文件的排版几乎都是固定的。

<!doctype html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
         <title>Document</title>
    </head>
    <body>
    </body>
    </html>

这些是一份html文件必不可少的标签。

<table> 
 <thead> 
  <tr> 
   <th>标签</th> 
   <th>用途和显示效果</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>&lt;html&gt;</td> 
   <td>html文件的根标签，必不可少的</td> 
  </tr> 
  <tr> 
   <td>&lt;head&gt;</td> 
   <td>定义了文档的信息</td> 
  </tr> 
  <tr> 
   <td>&lt;tite&gt;</td> 
   <td>定义了文档的标题，会显示在网页的小标签上</td> 
  </tr> 
  <tr> 
   <td>&lt;meta&gt;</td> 
   <td>用法很多后面详细解释</td> 
  </tr> 
  <tr> 
   <td>&lt;body&gt;</td> 
   <td>写在这里的东西都会显示到页面上</td> 
  </tr> 
 </tbody> 
</table>

这时候在body标签里面写的东西都会展示在网页上。写完需要保存，才会生效。

## 6.HTML文件展示效果 ##

html文件显示在浏览器上都是先从左到右，从上到下排列。

# 二、认识标签 #

## 1.什么是标签 ##

标签可以看作就是一个标记，当HTML文件执行时，每个标签会变成不同的样子出现在网页上。

## 2.标签的写法 ##

标签的写法都是<标签名></标签名>或者<标签名/>，前者是双标签，后者是单标签。双标签里面写的文字会在页面上显示出来。  
       为什么要分单双标签呢？需要自行百度。

## 3.标签的作用 ##

标签的作用就是一个占位符。告诉浏览器这里是什么，并且改怎么显示。

# 三、标签属性 #

## 1.什么是标签的属性 ##

标签的属性就是写在标签里的，用来扩展标签的。

## 2.属性的写法 ##

标签属性都是写在标签里的，比如

这里title就是标签的属性，标签的属性都是name=‘value’ 的格式来写的，标签里的多个属性用空格隔开。

## 3.属性的作用 ##

一个标签可以有多个属性，每个属性的作用各不相同，用来使标签加一些样式。这里举一些常用的例子。

# 四、常用标签详解 #

## 1.html标签 ##

称为根标记，用于告知浏览器其自身是一个 HTML 文档，<html>标记标志着HTML文档的开始，</html>标记标志着HTML文档的结束，在他们之间的是文档的头部和主体内容，其"lang"的意思就是“language”，语言的意思，而“en”即表示english，这个主要是给搜索引擎看的，搜索引擎不会去判断该站点是中文站还是英文站，所以这句话就是让搜索引擎知道，你的站点是中文站，对html页面本身不会有影响 。

<table> 
 <thead> 
  <tr> 
   <th>属性</th> 
   <th>值</th> 
   <th>作用</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>lang</td> 
   <td>en</td> 
   <td>这个主要是给搜索引擎看的，搜索引擎不会去判断该站点是中文站还是英文站，所以这句话就是让搜索引擎知道，你的站点是中文站，对html页面本身不会有影响</td> 
  </tr> 
  <tr> 
   <td>–</td> 
   <td>–</td> 
   <td>–</td> 
  </tr> 
 </tbody> 
</table>

## 2.head标签 ##

<head>标记用于定义HTML文档的头部信息，也称为头部标记，紧跟在标记之后，主要用来封装其他位于文档头部的标记。  
       一个HTML文档只能含有一对标记，绝大多数文档头部包含的数据都不会真正作为内容显示在页面中。

## 3.title标签 ##

<title>标记用于定义HTML页面的标题，即给网页取一个名字，必须位于<head>标记之内。一个HTML文档只能含有一对标记，<title></title>之间的内容将显示在浏览器窗口的标题栏中。

## 4.body标签 ##

<body>标记用于定义HTML文档所要显示的内容，也称为主体标记。浏览器中显示的所有文本、图像、音频和视频等信息都必须位于<body>标记内，<body>标记中的信息才是最终展示给用户看的。  
       一个HTML文档只能含有一对<body>标记，且<body>标记必须在<html>标记内，位于<title>头部标记之后。

## 5.<!doctype html> ##

这是申明了这个文件使用哪种类型。这时HTML5的声明模式，现在几乎都是这么声明。

## 6.网页标题小图标标签 ##

这会把图片显示在网页标题的前面  
.icon利于搜索引擎

## 7.meta标签 ##

<meta/>

<table> 
 <thead> 
  <tr> 
   <th>属性</th> 
   <th>值</th> 
   <th>作用</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>name</td> 
   <td>keyword</td> 
   <td>name属性主要描述网页，当name的值为keyword时，要再写一个content属性，它的值就是告诉seo这个网页的关键字</td> 
  </tr> 
  <tr> 
   <td>name</td> 
   <td>description</td> 
   <td>当name的值为description时,这时content属性的值就是告诉seo关于这个网页的描述</td> 
  </tr> 
  <tr> 
   <td>name</td> 
   <td>Author</td> 
   <td>当name的值为Author时,这时content属性的值就是告诉seo这个网址作者的名字</td> 
  </tr> 
  <tr> 
   <td>name</td> 
   <td>Generator</td> 
   <td>这时content属性的值就是告诉seo制作或生成该网页文档的是什么软件程序</td> 
  </tr> 
  <tr> 
   <td>name</td> 
   <td>Robots</td> 
   <td>这时content属性的值设定为 all：文件将被检索，且页面上的链接可以被查询；设定为 none：文件将不被检索，且页面上的链接不可以被查询；设定为 index：文件将被检索；</td> 
  </tr> 
  <tr> 
   <td>name</td> 
   <td>Robots</td> 
   <td>设定为 follow：页面上的链接可以被查询；设定为 noindex：文件将不被检索，但页面上的链接可以被查询；设定为 nofollow：文件将不被检索，页面上的链接可以被查询。aa</td> 
  </tr> 
  <tr> 
   <td>content</td> 
   <td>自定义</td> 
   <td>根据name属性的值来写</td> 
  </tr> 
  <tr> 
   <td>http-equiv</td> 
   <td>refresh</td> 
   <td>http-equiv主要用来重定向网页，当值为refresh，要再写一个content属性，它的值表示多长事件就刷新一次网页，content=“30”，表示每30秒就刷新一次网页，content="30；url=跳转的网页url"表示30秒后跳转到指定的网页</td> 
  </tr> 
  <tr> 
   <td>charset</td> 
   <td>UTF-8</td> 
   <td>规定文档的字符编码</td> 
  </tr> 
 </tbody> 
</table>

meta标签的用法很多，更加详细的可自行百度。

## 8.图片标签 ##

图片没有定义宽高的时候，图片按照百分之百比例显示，如果只更改图片的宽度或高度，图片会等比例缩放，只写一个就不会使图片变形。

## 9.超链接标签 ##

<table> 
 <thead> 
  <tr> 
   <th>属性</th> 
   <th>值</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>href</td> 
   <td>链接去往的路径，必写属性，没有就是空链，用#填写，最好不要为空</td> 
  </tr> 
  <tr> 
   <td>target</td> 
   <td>新窗口打开的方式， “_self”:默认值，在自身页面打开（关闭自身页面，打开链接窗口）</td> 
  </tr> 
  <tr> 
   <td>target</td> 
   <td>新窗口打开的方式， “_blank”:打开新页面（自身页面不关闭，打开一个新的链接页面）</td> 
  </tr> 
 </tbody> 
</table>

在<head>标签里面写<base target="\_blank">这样就可以使所有的超链接在新窗口打开。

**9.1超链接的锚点用法**  
       在当前页面通过标签的ID属性，用超链接来查找，页面会跳转到当前页面的那个锚点

## 10.文本段落标签 ##

网页中要把文字有条理地显示出来，离不开段落标记，就如同我们平常写文章一样，整个网页也可以分为若干个段落，而段落的标记就是<p>标签。  
       <p>是HTML文档中最常见的标记，默认情况下，文本在一个段落中会根据浏览器窗口的大小自动换行。

## 11.文本样式标签 ##

## 12.滚动标签 ##

<marquee>滚动字幕内容</marquee>

<table> 
 <thead> 
  <tr> 
   <th>属性</th> 
   <th>值</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>height</td> 
   <td>标签的高度</td> 
  </tr> 
  <tr> 
   <td>width</td> 
   <td>标签的宽度</td> 
  </tr> 
  <tr> 
   <td>behavior</td> 
   <td>滚动的方式，scroll:由一端滚动到另一端，会重复。slide:由一端滚动到另一端，不会重复</td> 
  </tr> 
  <tr> 
   <td>direction</td> 
   <td>设置滚动方向 dow下 left向左滚动 right 向右滚动 up 向上滚动</td> 
  </tr> 
  <tr> 
   <td>loop</td> 
   <td>设置滚动次数 （-1表示一直滚动下去）</td> 
  </tr> 
 </tbody> 
</table>

## 13.列表 ##

列表在网页中经常使用到，导航栏，新闻标题列表等地方都可以使用。

ul标签属性：

<table> 
 <tbody> 
  <tr> 
   <th>属性</th> 
   <th>属性值</th> 
   <th>描述</th> 
  </tr> 
  <tr> 
   <td>type</td> 
   <td>disc</td> 
   <td>实心小圆圈 ，默认值</td> 
  </tr> 
  <tr> 
   <td>square</td> 
   <td>小方块 </td> 
  </tr> 
  <tr> 
   <td>cricle</td> 
   <td>表示空心小圆圈</td> 
  </tr> 
 </tbody> 
</table>

## 14.表格 ##

<table>
    <caption>表头名</caption>
    <thead>
    	<th></th>
    	<th></th> 
    	<th></th>
    </thead>
    <tbody>
    <tr> 
    	<td></td>
    	<td></td>
    	<td></td>
    </tr>
    </tbody>
    <tfoot>
    <tr>
    	<td></td>
    	<td></td>
    	<td></td>
    </tr>
    </tfoot>
    </table>表格

<table></table>标签用于在HTML文档中创建表格。表格里面的格子叫单元格，用<td></td>标签定义。<tr></tr>标签定义的是行。

### 14.1表格的结构 ###

表格一般由表头，主体和页脚。  
       <thead></thead>：用于定义表格的头部，必须位于<table></table>标签之中。表头一般放的都是表格的标题。  
       <tbody></tbody>：用于定义表格的主体，位于<table></table>标签中，<thead></thead>标签之后。  
<tfoot></ tfoot >：用于定义表格的页脚，位于<table></table>标签中，<tbody></tbody>标签之后。

### 14.1 表格的属性 ###

表格的属性有很多，有的写在<table></table>标签中，有的写在<tr></tr>标签或者<td></td>标签之中。  
       写在<table></table>标签中的属性：

<table> 
 <thead> 
  <tr> 
   <th>属性</th> 
   <th>作用</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>align</td> 
   <td>表格的对齐方式，left左对齐，center居中对齐，right右对齐</td> 
  </tr> 
  <tr> 
   <td>bgcolor</td> 
   <td>设置表格的背景颜色</td> 
  </tr> 
  <tr> 
   <td>borde</td> 
   <td>表格的边框，默认值为1，表示边框粗细，写了之后会应用到单元格，但是修改的话只会影响表格的外边框</td> 
  </tr> 
  <tr> 
   <td>width</td> 
   <td>表格的宽度</td> 
  </tr> 
  <tr> 
   <td>height</td> 
   <td>表格的高度，写了之后不会影响表头的高度，会拉升单元格的高度</td> 
  </tr> 
  <tr> 
   <td>cellspacing</td> 
   <td>单元格之间的间距,默认为2px,为0的时候表格间是没有间距的 ，但是有边框的话，边框会重叠再一起</td> 
  </tr> 
  <tr> 
   <td>cellpadding</td> 
   <td>单元格边界与单元格内容之间的间距,默认为0</td> 
  </tr> 
  <tr> 
   <td>frame</td> 
   <td>规定表格外侧边框的那个部分是否可见</td> 
  </tr> 
  <tr> 
   <td>frame</td> 
   <td>void:外侧边框 不显示，box:所有的外侧边框都显示；border:所有的外侧边框都显示；等同于box，没有任何区别 ；above:显示外侧边框的上侧；below显示外侧边框的下侧；lhs:显示外侧边框的左侧；rhs:显示外侧边框的右侧；hsides：显示外侧边框的上下侧；vsides：显示外侧边框的左右侧</td> 
  </tr> 
  <tr> 
   <td>rules</td> 
   <td>指定表格内侧边框的那个部分是否可见</td> 
  </tr> 
  <tr> 
   <td>rules</td> 
   <td>none:不显示内线条，all:显示全部内线条；rows:显示行之间的线条；cols:显示列之间的线条；groups:显示行组和列组之间的线条，即表头和主体之间有线，行与行之间</td> 
  </tr> 
 </tbody> 
</table>

### 14.2表格的一些操作 ###

1.表格所有相邻单元格的边框合并

这是要写在style里的属性，和写在标签中的不一样，直接写在标签中不起作用

2.去表格外边框

也是要写在style里面，

3.表格缩写  
table>tr \* 几行>td \* 几列

4.两个单元格合并  
写在td标签中，要注意要把被合并的单元格注释掉或者不写，其实就是写属性的单元里面再加一个长度的单元格，所以要把后面的存在的单元格删掉，不然会多出来一个。要是后面没有单元格的话，再写会往后再加一个，撑大表格。

5.单元格内容垂直对齐  
即文字在单元格之中垂直对齐

## 15.表单 ##

表单是用来收集信息的

### 15.1表单的组成 ###

表单就是由一些控件组成和文本组成  
     表单控件：包含了具体的表单功能项，如单行文本输入框、密码输入框、复选框、提交按钮、重置按钮等。  
     提示信息：一个表单中通常还需要包含一些说明性的文字，提示用户进行填写和操作  
     表单域：他相当于一个容器，用来容纳所有的表单控件和提示信息，可以通过他定义处理表单数据所用程序的url地址，以及数据提交到服务器的方法。如果不定义表单域，表单中的数据就无法传送到后台服务器。

### 15.2表单的语法 ###

<table> 
 <thead> 
  <tr> 
   <th>标签</th> 
   <th>作用</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>fieldset</td> 
   <td>将表单分组，有一个框框住里面的控件，可以写 style=“border: none”&gt;来去除边框</td> 
  </tr> 
  <tr> 
   <td>legend</td> 
   <td>分组的名称，写在里的文字会出现在边框上</td> 
  </tr> 
  <tr> 
   <td>label</td> 
   <td>一般和控件一起使用，就是控件的说明，它的for属性对应控件的id，且只对应id，这样点击这个文字，会自动聚焦到这个控件上，即点击了这个控件。</td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <thead> 
  <tr> 
   <th>属性</th> 
   <th>作用</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>action</td> 
   <td>用来指定表单处理程序的位置(服务器端脚本处理程序），即表单提交的地址</td> 
  </tr> 
  <tr> 
   <td>method</td> 
   <td>定义表单结果从浏览器传送到服务器的方式，默认参数为：get:通过地址栏提交信息，不安全。post:手动输入参数</td> 
  </tr> 
  <tr> 
   <td>name</td> 
   <td>定义表单的名称</td> 
  </tr> 
 </tbody> 
</table>

### 15.3表单的提交（name属性） ###

在写完action和method，在写一个submit按钮，即提交按钮，就能进行数据的提交，注意这个按钮一定要写在form标签里 <input type=’submit’>，每一个input标签都需要有一个name属性，用来区分控件，才能进行提交。  
一定要用name，才能发送值。  
name的作用有很多，后面回来举例。

## 16. 控件 ##

用来收集用户输入的信息

### 16.1 控件的语法 ###

<table> 
 <thead> 
  <tr> 
   <th>type的值</th> 
   <th>作用</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>text</td> 
   <td>表示控件为单行文本框</td> 
  </tr> 
  <tr> 
   <td>password</td> 
   <td>表示控件为密码输入框,输入的值都显示为········</td> 
  </tr> 
  <tr> 
   <td>radio</td> 
   <td>表示控件为单项按钮</td> 
  </tr> 
  <tr> 
   <td>checkbox</td> 
   <td>表示控件为多选按钮</td> 
  </tr> 
  <tr> 
   <td>button</td> 
   <td>表示控件为普通按钮</td> 
  </tr> 
  <tr> 
   <td>submit</td> 
   <td>表示控件为提交按钮，在表单中使用较多</td> 
  </tr> 
  <tr> 
   <td>reset</td> 
   <td>表示控件为重置按钮</td> 
  </tr> 
  <tr> 
   <td>image</td> 
   <td>表示控件为图像形式 的按钮</td> 
  </tr> 
  <tr> 
   <td>hidden</td> 
   <td>表示隐藏域，隐藏控件</td> 
  </tr> 
  <tr> 
   <td>file</td> 
   <td>表示文件域,用来上传文件</td> 
  </tr> 
  <tr> 
   <td>h5新增</td> 
   <td>作用</td> 
  </tr> 
  <tr> 
   <td>url</td> 
   <td>网址控件</td> 
  </tr> 
  <tr> 
   <td>date</td> 
   <td>时间控件</td> 
  </tr> 
  <tr> 
   <td>email</td> 
   <td>邮件控件</td> 
  </tr> 
  <tr> 
   <td>number</td> 
   <td>数字控件，step属性每次增加的数值</td> 
  </tr> 
  <tr> 
   <td>range</td> 
   <td>(滑块属性)也有step属性</td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <thead> 
  <tr> 
   <th>控件的属性</th> 
   <th>作用</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>maxlength=“x”</td> 
   <td>表示只能输入x位字符，这是html自带的限制文字输入，以后用JS来控制</td> 
  </tr> 
  <tr> 
   <td>readonly=“readonly”</td> 
   <td>只读属性。不可修改</td> 
  </tr> 
  <tr> 
   <td>disabled=“disabled”</td> 
   <td>输入框未激活和只读差不多都不能输入</td> 
  </tr> 
  <tr> 
   <td>name=“自己起名”</td> 
   <td>表示控件的名称，用来给action区分是那个控件提交的信息</td> 
  </tr> 
  <tr> 
   <td>value=“自己设置”</td> 
   <td>默认值</td> 
  </tr> 
  <tr> 
   <td>Check = “checked”</td> 
   <td>选择控件中使用定义为选中</td> 
  </tr> 
  <tr> 
   <td>placeholder</td> 
   <td>控件的提示信息，占位的</td> 
  </tr> 
  <tr> 
   <td>required</td> 
   <td>表示此控件是必须要输入值的，不输入值点提交会出现提示信息</td> 
  </tr> 
 </tbody> 
</table>

### 16.2下拉列表 ###

### 16.3多行文本框 ###

16.4 控件的一些操作

1.控件边框去除：  
     要改控件的边框要先去框线和轮廓线，都写在控件的style属性里。  
边框去掉

控件轮廓线去掉

2.点击标签，使控件获取焦点  
      使用<lable>标签，<label for=“控件的ID名”>用户名（这样写鼠标移到用户名上时，跟随的文本框也会变换），点击控件前面的字就能激活标签，获取光标焦点。Id只能写对应控件Id。

# 五、网页字符集 #

## 1.特殊字符 ##

HTML里的一些特殊字符直接打印出来时会被浏览器误解，需要用另一种方法将其打印出来

<table> 
 <thead> 
  <tr> 
   <th>特殊字符</th> 
   <th>字符的代码</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>空格</td> 
   <td>&amp;nbsp;</td> 
  </tr> 
  <tr> 
   <td>&lt;</td> 
   <td>&amp;lt;</td> 
  </tr> 
  <tr> 
   <td>&gt;</td> 
   <td>&amp;gt;</td> 
  </tr> 
  <tr> 
   <td>&amp;</td> 
   <td>&amp;amp;</td> 
  </tr> 
  <tr> 
   <td>￥</td> 
   <td>&amp;yen;</td> 
  </tr> 
  <tr> 
   <td>©</td> 
   <td>&amp;copy;</td> 
  </tr> 
  <tr> 
   <td>®</td> 
   <td>&amp;reg;</td> 
  </tr> 
  <tr> 
   <td>°</td> 
   <td>&amp;deg;</td> 
  </tr> 
  <tr> 
   <td>±</td> 
   <td>&amp;plusmn;</td> 
  </tr> 
  <tr> 
   <td>×</td> 
   <td>&amp;times;</td> 
  </tr> 
  <tr> 
   <td>÷</td> 
   <td>&amp;divide;</td> 
  </tr> 
  <tr> 
   <td>²</td> 
   <td>&amp;sup2;</td> 
  </tr> 
  <tr> 
   <td>³</td> 
   <td>&amp;sup3;</td> 
  </tr> 
 </tbody> 
</table>

# 六、什么情况下使用哪种标签 #

1.尽可能的少用无语义的标签div和span;但不是不用。  
2.在语义不明显时，既可以使用div和p时，尽量使用p，因为p在默认情况下有上下间距，对兼容特殊终端有利。  
3.不要使用纯样式标签，如：b，font,u等，改用css设计。  
4.需要强调的文本，可以包含在strong或者em标签中strong默认样式是加粗（不要用b），em是斜体（不用i）;

# 七、HTML的注释 #

注释内容不会显示在浏览器窗口中，但是作为HTML文档内容的一部分，也会被下载到用户的计算机上，查看源代码时就可以看到。

# 八、浏览器 #

## 1.浏览器介绍 ##

浏览器是网页运行的平台，常用的有常用的浏览器有：  
           1.IE；  
           2.火狐（Firefox）；  
           3.谷歌（Chrome）；  
           4.Safari；  
           5.Opera等。  
2.浏览器内核：  
      浏览器内核也就是浏览器所采用的渲染引擎，渲染引擎决定了浏览器如何显示网页的内容，以及页面的格式信息，这就导致了浏览器兼容问题出现。  
           IE: 内核为trident  
           谷歌/Opera：内核为blink，blink其实webkit的分支  
           火狐：内核为gecko  
           苹果：内核为webkit

## 2.url介绍 ##

url就是打开浏览器，在地址栏输入的一个网址。  
     1.浏览器向服务器发送请求（通过http协议）。  
     2.Http协议：超文本传输协议，也就是浏览器和服务端的网页传输数据的约束和规范。  
     3.Url协议：规定了url地址的格式，平时我们写的地址网址就是url地址。

协议规定格式：scheme://host.domaln:port/path/filename  
Scheme:定义因特网服务的类型。常见的是http  
Host: 定义域主机 （http的默认主机是www）  
Domain:定义因特网域名，比如：baidu.com  
:port:定义端口号（网页默认端口：80）。  
Path:网页服务器上的路径  
Filenmae:文件名称

# 九、搜索引擎 #

seo（search engine Optimization） 汉译为搜索引擎优化。  
是一种利用搜索引擎的规则提高网站在有关搜索引擎内自然排名的方式  
是为了获取免费的流量。

TDK三大标签  
title:网页标题，网站名-描述，不要超过30个汉字  
description：

keywords:关键字，6到8个关键字，英文逗号隔开