块元素
- 页面以区域块的形式出现
- 特点：每个块元素通常都会独自占据一整行或者多整行，可以对其设置宽度、高度、对齐等属性，常用于网页布局和网页结构的搭建。
- eg：
<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>等
div元素
- 通用块级元素，主要用于布局
- "盒子"：设置边距宽高，可以容纳大多数HTML标记，多层
嵌套
- 最大的意义是与float配合，实现网页布局————DIV+CSS
行内元素
- 也称内联元素或内嵌元素
- 特点：一个行内元素通常会和它前后的其他行内元素显示在同一行中，它们不占有独立的区域，仅仅靠自身的字体大小和图像尺寸来支撑结构，一般不可以设置宽度、高度、对齐等属性，常用于控制页面中文本的样式。
- eg：
<strong>、<b>、<em>、<i>、<del>、<s>、<ins>、<u>、<a>、<span>等
span元素
- 行内元素，常与class配合使用，定义网页中某些特殊显示的文本
- 容器：容纳文本及各种行内标记，嵌套多层span
元素的转换（display）
- inline：此元素将显示为行内元素（行内元素默认的display属性值）。
- block：此元素将显示为块元素（块元素默认的display属性值）。
- inline-block：此元素将显示为行内块元素，可以对其设置宽高和对齐等属性，但是该元素不会独占一行。
- none：此元素将被隐藏，不显示，也不占用页面空间，相当于该元素不存在。
元素的浮动
- 所谓元素的浮动是指设置了浮动属性的元素会脱离标准文档流的控制，移动到其父元素中相应位置的过程。
- 设置浮动：选择器{float:属性值;}
- float三个属性：left(元素向左浮动)；right（元素向右浮动）；none（元素不浮动，此为默认值）
- 清除浮动：选择器{clear:属性值;}
- clear三个属性：left（不允许左侧有浮动元素（清除左侧浮动的影响））；right（不允许右侧有浮动元素（清除右侧浮动的影响））；both（同时清除左右两侧浮动的影响）
清除浮动注意事项
- clear属性只能清除元素左右两侧浮动的影响。
- 对子元素设置浮动时，如果不对其父元素定义高度，则子元素的浮动会对父元素产生影响。
清除浮动方法
- 使用空标记清除浮动
- 运用overflow属性清除浮动
- 使用after伪对象清除浮动
overflow
- 规范溢出内容的显示方式
- 选择器{overflow:属性值;}
- 属性：visible（内容不会被修剪，会呈现在元素框之外（默认值））；hidden（溢出内容会被修剪，并且被修剪的内容是不可见的）；auto（在需要时产生滚动条，即自适应所要显示的内容）；scroll（溢出内容会被修剪，且浏览器会始终显示滚动条）
元素的定位
- 定位模式：选择器{position:属性值;}
- 选择器{position:属性值;}
- 边偏移：top(顶端偏移量，定义元素相对于其父元素上边线的距离)；bottom（底部偏移量，定义元素相对于其父元素下边线的距离）；left（左侧偏移量，定义元素相对于其父元素左边线的距离）；right（右侧偏移量，定义元素相对于其父元素右边线的距离）
静态定位
- 静态定位static
- 相对定位relative
- 绝对定位absolute