html 块级元素 行内元素 行内块

一、块级元素

div、p、h1~h6、ul、ol、dl、li、dd、table、hr、blockquote、address、table、menu、pre，HTML5新增的header、section、aside、footer

image

特点：
★独占一行
★可以设置宽高 //个人理解：独占一行意味一定有行高，所以可以设置行高
★没有定义宽度时，宽度为父集元素的宽度
★行内块可以定义内外边距

块转行内 display:inline;
块转行内块 display:inline-block;

二、行内元素

span、img、a、lable、input、abbr（缩写）、em（强调）、big、cite（引用）、i（斜体）、q（短引用）、textarea、select、small、sub、sup，strong、u（下划线）、button（默认display：inline-block）

image

特点：
★在一行显示
★不能直接设置宽高
★宽高为内容撑开的宽高
★行内元素可以定义左右的内外边距，上下会被忽略掉

行内转块 display:inline-block;
块或行内转行内块 display:inline-block;

三、行内块元素
典型代表:img,input //【疑问】

特点：
★在一行上显示
★可以设置宽高