一、今日学习内容1.传统网页布局三种方式
（1）网页布局准则：多个块级纵向排列找标准流，多个块级元素横向排列找浮动
（2）标准流：按照默认规定的顺序方式排列
特点：
1.块级元素独占一行，从上到下排列
2.行内元素会按照顺序，从左到右进行排列，碰到父元素的边缘会自动换行
（3）浮动：改变元素标签默认的排列方式（float：left/right/none(默认值)）
应用：使多个块级元素在一行内排列显示
特性：
1.会脱离标准流
2.浮动元素会在一行内显示并且元素顶部对齐
3.浮动元素具有行内块特点
4.可做到文字环绕，不会压住下面盒子文字内容
5.浮动元素之间没有空隙
浮动元素布局注意：
1.浮动一般会和标准流父盒子搭配使用
2.一个元素浮动，其他的兄弟元素也需要跟着浮动
3.浮动的盒子只会影响后面的标准流
清除浮动
1.额外标签法（隔墙法）.clear {clear：both}
2.给父级样式添加overflow：hidden
3.给父级添加after伪元素
4.给父元素加双伪元素
（4）定位
目的：滚动屏幕时将盒子固定到屏幕的某个位置；某个元素可以自由在盒子内移动并且会压住盒子。
定位=定位模式+边偏移
定位模式有：position：static 静态定位
position：relative 相对定位（未脱标）
position：absolute 绝对定位特点：
1.如果祖先元素没有定位，则会以浏览器为标准进行定位
2.如果祖先元素有定位，则以最近一级有定位的祖先元素为参考点移动位置
3.不会占有原来位置（脱标）
4.会和父元素相对定位结合使用
position：fixed 固定定位
position：sticky 粘性定位
2.字体图标在字体图标网站搜索下载图标，在html文件中引入css文件，然后在所要引入的标签中调用类
二、今日问题
未遇到问题
三、解决方案
未遇到问题
|
