HTML 常用标签

a 标签

href页面跳转的地址

<a href="//google.com"></a>

跳转外部链接时，这种写法最简洁，因为会自动适配 http/https。

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

首位的/表示项目的根目录，即服务启动的位置。

<a href="#"></a>

当 href 的值为#号时，点击标签，页面会在当前页刷新，可以用javascript:alert:;替换#实现什么都不做。

<a href="mailto:mcbbugu@gmail.com"></a>
<a href="tel:152****3245"></a>

发邮件和拨打手机

target目标窗口

<a href="#" target="_blank"></a>

在新页面打开

<a href="#" target="_self"></a>

在自身打开

<a href="#" target="_top"></a>

在顶层页面打开，用于 iframe 标签中

table 标签

table 标签中只有3个子标签分别表示头，主题，尾巴

<table>
    <theader/><theader/>
    <tbody/><tbody/>
    <tfoot/><tfoot/>
</table>

如果不使用以上3个标签，则浏览器会把内容默认放入一个 tbody 中 这3个标签中可以包含 tr，表示一行 每个 tr 中可以包含多个 th，td，th 表示第一行的头，有加粗效果。

给table设置属性

<style>
        table{
            table-layout: auto;
        }
</style>

其中 auto 表示根据内容给宽度，fixed 则是平均给，所以 auto 更常用

table{
    width: 400px;
    table-layout: auto;
    border-spacing: 0;
    border-collapse: collapse;
}

其中 border-spacing 控制单元格之间的距离，border-collapse 控制单元格是否合并

img 标签

属性 alt 是图片加载失败时显示的文字
height, width 如果只写其中一个，则另一个会自适应 给 img 标签加上 max-width: '100%' 即可实现图片的响应式，也就是自适应大小。

form 标签

发送请求，然后刷新页面

<form action="/xxx" method="POST">
        <input type="text" />
        <input type="submit" />
</form>

action 发送请求

<form action="/xxx" method="POST" autocomplete="on">
        <input name="username" type="text" />
        <input type="submit" />
</form>

autocomplete 用于开启下拉提示，提示内容根据输入框的 name 值获取。

target 属性可以指定提交请求的目标页面

input 和 button 提交的区别是，button支持里面加子标签。 input 中 type 常用类型：text, color, password, radio, checkbox, file。

textarea 标签

<textarea name="1" id="" cols="30" rows="10" style="resize: none;"></textarea>

其中 style="resize: none;" 表示不允许拖动

select 标签

<select name="" id="">
        <option value="1">one</option>
        <option value="2">two</option>
        <option value="3">three</option>
</select>

option 表示选项，value 表示选中项的id