一、标准流

1、块级元素：div、table表格、H1~H6、p段落、有序无序列表（ol、ul、li)——纵向排列

2、内联元素：a 超链接、span 文字、img 图片、input 空键——横向排列

标准流

块级元素 ：div   h1-6  有序无序列表 （ol ul li）p段落 纵向排列

内联元素：img  a  span文字 input控件  横向排列

HTML中三大布局方式

1. 标准流（文档流）

2. 浮动

3. 定位

其中标准流存两种元素：

1. 块级元素（div、table、H1~H6、有序无序列表（ol、ul、li）、p）

2. 内联元素（a、span、image、input）

量大元素:块级元素，内联元素

html可以分为两大元素

1、块级元素（div、h1-h6标题、有序无序列表「ol、ul、li」、table表格、p段落、···）

区别：独占一行。

2、内联元素（a超链接、span文字、img图片、input控件、）

区别：内联元素和相邻内联元素在同一行，如果一行内宽度不够时才会被挤到另一行去。

这两种元素的排列方式呢，是在没有特殊属性的干扰下，在正常的标准流中所表现出来的正常特性。

布局方式：
1.标准流

2.浮动布局

3。定位布局

4.弹性布局

常见块级元素：div,H1~H6,table,p,ol,ul,li

常见内联元素：a,span,img,input

HTML中的三种布局方式

标准流

浮动

定位

标准流两大元素

1. 块级元素 ：div，H1-H6,有序无序列表（ol,ul,li）,table，p

2. 内联元素： a, span,img ,input
   

两大元素的

三种布局方式：标准流，浮动，定位。

两大元素

块级元素：独占一行。div Hx ol ul li p table。。。

内联元素：a span em br input img 

以上是传统的标准流

HTML中三种布局方式：

1、标准流：顺序布局

1）块级元素：div、H1~H6、table、(ol、ul、li)、p段落（独占一行）

2）内联元素：a、span、img、input（在同一行）

2、浮动

3、定位

HTML 中的三种布局方式 1.标准流 2.浮动 3.定位

布局元素分类：

1. 块级元素：div table h1-h6  ul ol li有序无序列表 p段落标记

2. .内联元素： a 超链接  span 文字 img 图片 input 控件

区别：块元素：独占一行；内联元素是和相邻的内联元素在同一行。

1. 块级元素（元素独占一行）

div

h1~h6

列表元素（ol、ul、li）

table

p

...

2.内联元素(元素排列与同一行)

故而需要display：block；变为块级元素

a、span、img、input

div 块元素 竖直排列

span 内敛元素 横向排列（）

Html中的三种布局方式

1. 标准流

2. 浮动

3. 定位
   

标准流

内联元素

块级元素

HTML的内涵

HTML 中的三种布局方式 1.标准流 2.浮动 3.定位 布局元素分类： 1.块级元素：div table h1-h6  有序无序列表 p段落标记 2.内联元素： a 超链接  span 文字 img 图片 input 控件 区别：块元素：独占一行；内联元素是和相邻的内联元素在同一行。

html布局方式：1标准流  2浮动 3定位

常用的内联元素；

a 超链接   

span 文字

input  控件

img 图片