语义化标签以及经常使用标签

_版权声明：本文为博主原创文章，转载请注明出处。
https://github.com/ZhengMaste...

一开始接触到页面这个东西，毫无疑问你们首页看到的是html这玩意。我对html有了初步的认识是在我大二上数据结构这门课程的时候老师讲课之余就给咱们讲讲深度学习，网页设计之类的简单知识。自从那之后就断断续续在W3school以及MDN学习它，如下内容是对以前的学习作个较为简单的总结。👇

经常使用标签

html标签又称为html元素，html元素分为行内(内联)元素、行内块级元素以及块级元素。

行内元素的特色

• 这些行内元素自己的属性display:inline，而行内块级元素则为display:inline-block;
• 和其余行内元素从左到右在一行显示，给它设置的宽高值无效，但能够设置内外边距的值(左右有效，上下无效)
• 行内元素的宽高是由自己内容的大小决定（文字、图片等）
• 行内元素只能容纳文本或者其余内联元素，不要在行内元素嵌套块级元素

常见的行内元素
“span” 标签，一般用于放一些文字和icon图标之类做为内敛容器等
”script“ 标签，经常使用于引入外部文件，嵌入代码等
“a” 标签，经常使用于超连接，锚点等方面
“img” 标签，用于引入外部图像文件
“br” 标签用于换行
“input” 标签，用于表单控件
“button" 标签，页面按钮
”label“ 标签，一般结合input来使用，至关命名标签
“select” 标签，选项标签
”textarea“ 标签， 文本区域
“i” 标签，呈现斜体文本，此外许多框架用它制做页面小图标等
“b" 标签，加粗文本，新的标准出来不推荐使用
“em” 标签，用于将文本进行强调
”strong“ 标签， 用于将文本进行强调加粗
“big” 标签， 大字体文本
”small“ 标签， 小字体文本

常见的行内块级元素

行内块级元素的特征

1. 不自动换行,若是超出父元素(不为行内元素)width则换行
2. 能够设置宽高
3. 在一行内从左到右依次排列

在HTML5中，开发者能够自定义标签，在任意定义标签中，设置display:block属性便可变为块级元素，display:inline就为行内元素，display:inline-block则为行内块级。绝大多数标签都是能够互相转换的。

常见的块级元素

块级元素的特征

1. 能够设置宽高，内外边距等
2. 能够内嵌其余元素（无论是块级的内联的仍是行内块级的元素）
3. 独占每一个块级元素默认一行，能够自动换行，默认排列方式为从上至下

div - 经常使用块级容易，也是 css layout 的主要标签
p - 段落标签主要用于文章段落，多行文字方面
ul - 无序列表
ol - 有序列表
form - 交互表单
h1~h6 标题标签
hr - 水平分割线
dl - 定义列表
address - 地址
blockquote - 块引用
center - 举中对齐块， 等等其余不经常使用的标签
**

HTML5中新增常见的标签以及其语义化(如下顺序不分前后)

**
header 🔼 页眉（网页（部分区域）的头部 顶部 导航区域等等） 块级元素
nav 🔼 导航连接部分 块级元素
section 🔼 标签订义网页中的区域（部分）。好比章节、页眉、页脚或文档中的其余部分。块级元素
article 🔼 内容是引用其余地方的。一个区域中的，另一部份内容；块级元素
aside 🔼 和article 是一块儿使用；是辅助 article 区域的内容。也能够理解为整个网页的 辅助区域
footer 🔼 页脚（网页（部分区域）的底部|版权区域等等） 块级元素
audio 🔼 播放声音文件，好比音乐或其它音频流 行内元素
video 🔼 播放视频文件，好比电影或其它视频流 行内元素
canvas 🔼 定义图形，好比图表和其余图像 有着默认宽高 行内元素
hgroup 给标题分组，为标题或者子标题进行分组 块级元素
figure 对多个元素进行组合 块级元素
figcaption 定义 figure 元素的标题 块级元素
output 定义输出的一些类型。
details 定义元素的细节
command 定义命令按钮
summary 为 details 元素定义可见的标题
mark 主要用来在视觉上向用户呈现那些须要突出的文字 高亮字体
meter 🔼 标签订义度量衡。仅用于已知最大和最小值的度量。必须定义度量的范围，既能够在元素的文本中，也能够在 min/max 属性中定义。
progress 定义任何类型的任务的进度 标签运行中的进程。可使用 标签来显示 JavaScript 中耗费时间的函数的进程
time 🔼 定义日期或时间，或者二者 行内元素
datalist 🔼 定义可选数据的列表。与 input 元素配合使用，就能够制做出输入值的下拉列表 行内元素
embed 定义嵌入的内容，好比插件。用来插入各类多媒体，格式能够是MIDI、MP3等 行内元素 有默认宽高
keygen 定义生成密钥
source 🔼 为媒介元素（好比 video 和 audio）指定多个播放格式与编码，浏览器会自动选择第一个能够识别的格式 行内元素

查看所有标签或者进一步了解这些标签的属性以及如何请移步☞http://www.w3school.com.cn/ta...