web前端：CSS定位

作者:快敲小张 更新于： 2020-03-02 12:01:38

　　随着html的成长，为了满足页面设计者的要求，HTML添加了很多显示功能。但是随着这些功能的增加，HTML变的越来越杂乱，而且HTML页面也越来越臃肿。于是css便诞生了。

　　CSS中定位元素使用position（分别由两个元素其一规定元素定位类型其二规定元素定位位置）

　　对于其一：分为static静态定位、relative相对定位、absolute绝对定位、fixed固定定位

　　队医其二：属性分别为top、bottom、left、right

　　一、静态定位static：

　　元素默认为静态定位，静态定位的唯一作用就是取消定位。

　　二、相对定位relative：

　　1.占位置，不会脱离标准流。继续占据原有的位置，元素移动后覆盖其他元素上面

　　2.位置移动的基准点为自己左上角为基准点

　　三、绝对定位absolut:

　　1.绝对定位脱离标准流，不占位置，后面的位置会移动到上面来

　　2.基准点：若父元素（祖先）没有使用定位（绝对定位、相对定位、固定定位）则以浏览器屏幕左上角为基准点

　　若父元素（祖先）有使用定位，则以父元素的左上角为基准点

　　通常说的子绝父相的意思是：父元素通常使用相对定位，子元素使用绝对定位。主要原因是父元素通常是盒子，需要占位置，所以使用相对定位，使元素不脱离标准流，后面的元素不会

　　顶上来，而子元素使用绝对定位，是为了使它可以随意移动位置，且不占位置。

　　CSS为HTML标记语言提供了一种样式描述，定义了其中元素的显示方式。CSS在web设计领域是一个突破。利用它可以实现修改一个小的样式更新与之相关的所有页面元素。