行内元素，块元素，行内块元素

行内元素的特点：

1. 总是和相邻的行内元素在同一行上
2. 设置宽高无效，水平方向的padding和margin属性可以设置，但是垂直方向上的无效
3. 默认宽度是他自身内容的宽度
4. 行内元素只能容纳其他行内元素或者文本。

常见的行内元素：a- 锚点

abbr - 缩写

acronym - 首字

b -粗体(不推荐)

bdo - bidi overridebig -大字体
br - 换行cite - 引用
code - 计算机代码(在引用源码的时候需要)dfn -定义字段
em –强调
font -字体设定(不推荐)i - 斜体
img -图片input - 输入框kbd -定义键盘文本label -表格标签q-短引用
s -中划线(不推荐)
samp -定义范例计算机代码select -项目选择
small -小字体文本
span -常用内联容器，定义文本内区块strike - 中划线
strong-粗体强调

sub -下标sup - 上标
textarea -多行文本输入框tt ―电传文本
u一下划线
 

 

块元素的特点：

1. 总是另起一行
2. 可以设置其宽度、高度，内外边距
3. 在不手动设置宽度的情况下，宽度默认为所在容器的100%（容器宽度）
4. 可以容纳行内元素和其他块元素

常见的块元素：p：段落标签
div：把DIV看作是一容器,容器专门用来包含内容
h1、h2 h3 h4 h5 h6标题
form：表单
ul：无序列表，与li绑定
ol：有序列表，与li绑定
hr：分隔

address -地址
blockquote -块引用

center - 举中对齐块dir -目录列表
div - 常用块级容易，也是css layout的主要标签dl-定义列表
fieldset - form控制组form-交互表单
h1 - 大标题h2 -副标题h3 -3级标题h4 - 4级标题h5 -5级标题h6 -6级标题

hr - 水平分隔线
isindex - input promptmenu -菜单列表
noframes - frames可选内容，
ol -有序表单
p -段落
pre -格式化文本table -表格ul -无序列表

行内块元素的特点：

1. 和相邻行内元素在同一行，但是之间会有空白缝隙。
2. 默认宽度是他本身内容的宽度。
3. 宽度、高度、行高、外边距以及内边距都可以手动设置

常见行内块元素：input img td

转换

块级元素： display:block;

行内元素 ： display:inline;

行内块元素： display: inline-block