HTML - 常用标签

a 标签的用法

1. 超链接

<a href = "跳转的网址" >百度一下</a> 

此用法指的是点击百度会跳转到百度页面中

2. 锚点定位

<a href = "#id名称">某某标题</a>
<h2 id = "id名">网易游戏</h2>

此用法指的是给标签（比如<p >、<span>等）和<a> 链接标签指定一个相同的 id 名，即可在同一页面上相互跳转。

3. 打电话、发邮件等等功能

<a href = "tel:1×××××××××">给某人打电话</a>
<a href = "mailto:×××@163.com">发邮件</a>

此用法就会给指定的人打电话或者发邮件

4. 不同的 html 页面的相互跳转

<a href="index.html"></a>

直接将html文件名写进href中即可

---

img 标签的用法

<img src=" 图片地址" alt="图像的替代文字" title="鼠标悬浮的提示文字" width="图片宽度" height="图片高度"/>

例子：
<img src="image/dagou.jpg" alt="大狗" title="此处有犬，生人勿进" width="300px" height="200px"/>
注意

1. img标签时内联元素，也是空元素，图片并不是img的内容，是单独存在的，并且html页面是纯文本的；
2. 为了符合工业html标准，必须加上alt属性；
3. 浏览器是加载完html页面后，按序地请求图片资源；
4. 浏览器可以通过width和height建立页面布局，但推荐提前就裁剪好图片，否则还是会下载完整的大图像；
5. 图像宽度要小于800px；
6. 图像用作链接时，要放在a标签内。

---

table 标签的用法

    <table>
      <thead>
        <tr>
          <th></th>
          <th>周一</th>
          <th>周二</th>
          <th>周三</th>
          <th>周四</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <th>上午</th>
          <td>学习</td>
          <td>学习</td>
          <td>学习</td>
          <td>学习</td>
        </tr>
        <tr>
          <th>中午</th>
          <td>学习</td>
          <td>学习</td>
          <td>学习</td>
          <td>学习</td>
        </tr>
        <tr>
          <th>下午</th>
          <td>学习</td>
          <td>学习</td>
          <td>学习</td>
          <td>学习</td>
        </tr>
      </tbody>
      <tfoot>
        <tr>
          <th>总计</th>
          <td>学习</td>
          <td>学习</td>
          <td>学习</td>
          <td>学习</td>
        </tr>
      </tfoot>
    </table>

1. 相关的标签

 table
 thead  表格的头部
 tbody  表格的主体
 tfoot  表格的尾部
 tr     行
 td     内容（数据）
 th     表头（每一排的头）

2. 相关的样式

table-layout          
border-collapse   控制 border 是否合并（表格常用）  
border-spacing    控制 border 与 border 之间的距离（表格常用）

---

其他感想

入门容易，精通难，不忘初心，方得始终！