HTML常用标签

<a>标签

<a>标签用于跳转外部网页、内部锚点或者电话/Email等等

属性

href 超链接

<a href="//google.com">超链接</a>
<!-- 对于这种双斜杠写法，浏览器会自动成功定向到‘https://www.+网址’的路径 -->

路径

**/a/b/c/**在浏览器中，这种类似绝对路径的写法是指浏览器当前服务下的路径并不是指本地盘的路径

a/b/c

index.html或**./index.html**

伪协议

<a href="javascript:;">查看</a>
<!-- 制作什么都不会发生的a按钮 -->
<a href="#xxx">跳转至xxx</a>
<!-- 页面跳转至相应锚点 -->
<a href="mailto:xxx@mail.com">给xxx发邮件</a>
<a href="tel:123456789">给xxx发邮件</a>

target 指定目标页面在何处打开

• _self: 当前页面加载，即当前的响应到同一HTML5浏览上下文。此值是默认值。
• _blank: 新窗口打开，即到一个新的未命名的HTML5浏览器上下文
• _parent: 新窗口在frame父浏览上下文。如果没有parent框架或者浏览上下文，此选项的行为方式与 _self 相同。
• _top: 加载响应进入顶层浏览上下文（即，浏览上下文，它是当前的一个的祖先，并且没有parent）。如果没有parent框架或者浏览上下文，此选项的行为方式相同_self

<table>标签

• <thead> 表顶部，例如表第一行项目
• <tbody> 表内容，例如表数据部分
• <tfoot> 表底部，例如合计部分 以上三个标签，在HTML中可以不按指定顺序写。浏览器会自动对三个标签排序：thead=>tbody=>tfoot
• <th> 表头，例如每一行的第一列项目
• <td> 表数据/表元，例如每一格具体数据
• <tr> 表行，定义表的每一行

<table>
        <thead>
            <tr>
                <th></th>
                <th>英语</th>
                <th>翻译</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <th>小红</th>
                <td>88</td>
                <td>95</td>
            </tr>
            <tr>
                <th>小明</th>
                <td>95</td>
                <td>88</td>
            </tr>
        </tbody>
        <tfoot>
            <th>总计</th>
            <td>183</td>
            <td>183</td>
        </tfoot>
    </table>

样式

• table-layout: 值为auto时，表宽度按内容自动调整；值为fixed时，表宽度固定
• border-collapse: 合并表边框
• border-spacing: 控制单元格边框间距 一般对表格进行reset清除默认表样式

table{
            /* 使表格边框合并 */
            border-collapse: collapse;
            /* 是单元格边框间距为0 */
            border-spacing: 0;
        }

<img>标签

<img>标签会向服务端发出get请求，获得图片

属性

• alt alternative，图片加载失败时，显示alt指定的内容
• height和weith 指定高宽，单位限制为px，不用写单位。只允许指定高或宽，不允许同时指定高宽。
• src source，指定图片地址

事件

• onload 图片加载成功时触发
• onerror 图片加载失败时触发

响应式

指定图片最大高宽、最小高宽。例如max-width=100%

<form>标签

<form>标签向服务端发送get或post请求，然后刷新页面

属性

• action 指定form所请求服务器的地址
• autocomplete 增加该属性，文本框会出现文本提示，自动填充
• method 指定以何种http方式发送提交表单请求
• target 同<a>标签的target属性

事件

onsubmit 当提交表单时触发

<input>标签

<input>让用户输入内容

属性

• 类型 button,checkbox,file,hidden,number,password,radio(单选框),search,submit,tel,text
• 其他 name,autofocus,checked,disabled,maxlength,pattern,value,pleaceholder

事件

• onchange 当用户输入改变时触发
• onfocus 当焦点集中在该元素时触发
• onblur 当元素失去焦点时触发