HTML标签

语义化标签

语义化标签<header>、 <nav> 、<sidebar> 、<article> 、 <footer>等
无语义化标签 <div>、<span>

常用标签

标题

Emmet语法你可以理解为便捷输入

<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>

段落标签

<p>段落文字</p> 

换行和水平线标签

<br>
<hr> //水平线

文本格式化

标签	说明
b	加粗
u	下划线
i	倾斜
s	删除线

标签	说明
strong	加粗
ins	下划线
em	倾斜
del	删除线

路径

绝对路径

具体地址，如C:\Program Files\7-Zip\7-Zip.exe

相对路径

./   //本级目录
../  //上级目录
~/   //根目录

媒体

图片

<img src="" alt="">

alt：方便视觉障碍者或图片无法加载

视频

<video src=""></video>

controls：显示控制条

loop：循环

音频

<audio src=""><audio>

链接

<a href="" target="_self"></a>
<a href="" target="_blank"></a>  //新窗口

列表

无序

<ul>
    <li>无序列表项目</li>
    <li>无序列表项目</li>
</ul>

有序

<ol>
    <li>有序列表项目</li>
    <li>有序列表项目</li>
</ol>

自定义

<dl>
    <dt>标题</dt>
    <dd>内容</dd>
    <dd>内容</dd>
</dl>

表格

<table>
<caption>标题</caption>
    <thead>
        <th>行标题1</th>
        <th>行标题2</th>
    </thead>
<tbody>
    <tr>
        <td>项目1</td>
        <td>项目2</td>
    </tr>
    <tr>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
    </tr>
</tbody>
<tfoot>
    <tr>
        <td></td>
        <td></td>
    </tr>
</tfoot>
</table>

colspan：跨列合并

rowspan：跨行合并

表单

<form action="">
</form>

input

Type	说明	属性	Emment语法	图片
text	文本框	placeholder、width、height	input:t
password	密码	name、placeholder	input:p
radio	单选框	name、checked	input:r
checkbox	多选框	name、checked	input:c
file	文件选择	value	input:f
submit	提交	value	input:s
reset	重置	value
button	普通	value	input:b

• placeholder 提示文字
• checked 默认状态
• value 可修改按钮名称

button

Type	说明	属性
submit	提交	value
reset	重置	value

select

<select>
    <option>red</option>
    <option selected>blue</option>
</select>

textarea

<textarea></textarea>

cols：可见宽度

rows：可见行数

blockquote

<blockquote>
    内容
</blockquote>