HTML常用标签

HTML中有很多常用的标签，包括<a> <img> <table>等。

1.a标签的用法

a标签<a>，a是单词anchor（锚点）的首字母。它的作用是跳转到一个元素上它具有许多属性，一些常用的属性如下：

• href属性，是a标签最重要的，也是必须的一个属性，因为是由href属性来指定指定链接的目标URL的。常见的有：
  • 网址：可以是https://google.com、http://google.com 还可以是 //google.com。
  • 路径：可以是本地文件的一个绝对或相对路径。/a/b/c、a/b/c、./index.html等。
  • 伪协议：包括js动作、mailto: 邮箱、tel: 手机号等。
  • id：href=#xxx，同页面元素的id，此时点击a标签会跳转到id=xxx的元素。
• download属性。下载而非打开页面，不是所有浏览器都支持，手机浏览器可能不支持。
• target属性。声明在哪个页面打开需要跳转的元素。若此页面不存在则创建一个新页面并用target中的值命名。target标签的值有多种，常用的有：_blank、_top、_parent、_self等。

a标签的属性列表如下，其中黑框部分表示已被HTML5删除的属性，蓝框表示新增的属性。

2.table标签的用法

table标签用来定义 HTML 表格，相关的标签如下：

• <thead> table head的缩写，代表此标签包含区域的位置是表头。
• <th> 表头的真正标题。
• <tbody> 表的主体。
• <tfoot> 表结尾部分。
• <tr> table row代表表格中的一行。
• <td> table data表格中的内容。 一个 HTML 表格包括一个或多个<tr>、<th>以及<td>元素。

注意：<thead> 、<tbody>、<tfoot>不一定按顺序出现。

相关样式：

• table-layout: fixed 表示每行/列尽量平均。
• table-layout: auto则会根据内容的多少来自动调整每行/列的高度或宽度。
• border-collapse: collapse 表示表格内的框线合并。

3.img标签的用法

img标签，image的简称，作用是发出get请求，展示一幅图像。
img标签的属性有：

• src属性。source的简称。声明该图片的来源，可以是一个网址，也可以是图片的本地路径。
• alt属性。其内容为当图片加载不出来时显示的内容。
• height和width属性。设定图片的高和宽。 注意

1. 一般只设定一个，否则可能会导致图片变形。前端的底线之一就是不能让图片变形。
2. src属性和alt属性是必须的两个属性。
3. 通过设置样式为max-width: 100%来确保图片在小屏幕手机上可以完全显示。

事件

• <script> xxx.onload= js code </script>当图片加载出来时会执行什么操作。
• <script> xxx.onerror= js code </script>当图片加载不出来时会执行什么操作。