css_布局和定位

css的学习的困难点(日后补充)

开始学习前端三大基础的css了,css和js的学习方式完全不同,css有自己的特点。先了解一下css为什么难学

  • CSS属性不正交

css的文档流

文档流(normal flow)

网页中的流就是对文档的读取和输出的顺序。其遵循从左到右,从上到下的读取,输出和显示顺序。
简单点说,内联元素依次从左到右水平排列,块级元素从上倒下竖直排列。
由此可以总结一个常用的结论: 块级元素的高度取决于内部文档流元素高度的总和。

脱离文档流

脱离文档流的元素的位置就不再受文档流的影响了。
脱离文档流的元素的位置由脱离文档流的方式决定。
常用的有

1
2
3
4
5
position: fixed //元素的位置相对于屏幕确定的

position: absolute //元素的位置相对于最近的position: relative元素确定的

position: float //待总结