html 标签元素

html标签参考手册

HTML中标签元素一般会分成三种不同类型，分别为：块状元素，行内元素，行内块状元素。

块状元素（block）

特点：
1、独占一行，每一个块状元素都会从新的一行重新开始，从上到下排布
2、可以直接控制宽度、高度以及盒子模型的相关css属性（元素的高度、宽度、行高以及顶和底边距都可设置）
3、在不设置宽度、高度的情况下，块级元素的宽度是它父级元素的宽度，高度是它本身内容的高度
因为这些特点，我们通常会使用块状元素来进行大布局（大结构）的搭建。

常用的块状元素 ：
1、普通元素：
div（常用块状容器，也是css layout的主要标签）、p（段落）、hr（水平分隔线）、table（ 表格）、form（交互表单）
2、标题元素：
h1（大标题）、h2（副标题）、h3（三级标题）-- h6（六级标题）
3、列表元素：
menu（菜单列表）、ol（有序列表）、ul（无序列表）、li（列表项）、dl（定义列表）、dt（定义术语）、dd（定义描述）

行内元素（inline）

特点：
1、和其他内联元素从左到右在一行显示
2、不能直接控制宽度、高度以及盒子模型的相关css属性，但是直接设置内外边距的左右值是可以的
3、内联元素的宽高是由本身内容的大小决定（文字、图片等）
4、内联元素只能容纳文本或者其他内联元素（此处请注意，不要在内联元素中嵌套块级元素）
因为这些特点，我们通常会使用行内元素来进行文字、小图标（小结构）的搭建。

常用的行内元素 ：
1、普通元素标签：
span（常用内联容器，定义文本内区块），a（锚点，链接），img（引入图片），br（强制换行），sub（下标），sup（上标）
2、文本文字修饰标签：
b（加粗），strong（加粗强调），i（斜体），em（斜体强调），，big（大字体文本），small（ 小字体文本），s（中划线（不推荐使用）），strike（中划线），del（文档中已被删除的文本），u（下划线）
3、表单内使用的标签元素：
textarea（多行文本输入框），input（输入框），select（下拉列表），label input（元素定义标注（标记））

行内块状元素 （inline-block）

特点：
1、和其他元素都在一行上，不会自动换行，默认排列方式为从左到右；
2、元素的高度、宽度、行高以及顶和底边距都可设置。
行内块状元素综合了行内元素和块状元素的特点，但是各有取舍。因此行内块状元素在日常的使用中，由于其特点，使用的次数也比较多，在很多方面都很有用。