CSS（五）|页面布局之浮动

01.CSS浮动

1.1传统网页布局的三种方式

1.2标准流（普通流/文档流）

1.3为什么需要浮动？



1.4什么是浮动？





1.5浮动特性（重难点）













1.6浮动元素经常和标准流父级搭配使用

案例：小米布局案例

02.常见网页布局

2.1常见网页布局

2.2浮动布局注意点

03.清除浮动

3.1为什么需要清除浮动?

3.2清除浮动本质


3.3清除浮动方法

3.4清除浮动总结

04.PS切图

4.1常见的图片格式


4.2图层切图

4.3切片切图

4.4PS插件切图

05.学成在线案例

5.1准备素材和工具

5.2案例准备工作

5.3CSS属性书写顺序(重点)



5.4页面布局整体思路

5.5确定版心

5.6头部制作



5.7banner制作
5.8精品推荐小模块

5.9精品推荐大模块


5.10底部模块