CSS的定位之position

来源：互联网发布：淘宝改了名称搜不到编辑：程序博客网时间：2024/05/16 15:29

自学前端的这两个月，自觉CSS里面有那么一丢丢绕的其实就几个问题：

定位（position），浮动，兼容性（当然，这个不仅仅是写CSS时要考虑的问题）。今天先屡一下定位，很多不完善的地方希望好心的大侠帮忙指出来哈哈~【#(∩_∩)#】~

position的基本定义

1，absolute（绝对定位）：相对于最近的父级元素，如果没有给这个父级元素表明相对定位（relative），那么会默认为相对body。

2，relative（相对定位）：相对于自身的位置。

3，fixed：相对于浏览器窗口，进行定位（可以脑补那些消不掉的小广告~）

——————————————————————————————————

4，static（默认值）：没有定位，会忽略top,bottom,left,right,z-index等声明。

5，inherit（继承）：从父元素继承position属性。

且，z-index数值越大越在上层。

/*对于absolute结合relative使用，我的理解是：注意absolute不是去寻找relative作为父级元素进行相对定位——而是，要父级+relative两者兼备才可以进行相对定位*/

position的常用总结

一，让一个div相对父级元素居中的几种方法

1，margin:0 auto;（左右居中）

2，先给父级元素表明 position:relative;

然后再给该元素标以下

position:absolute;

left:50%;top:50%;

marigin-left:-1/2width;

margin-top:-1/2height;

上下和左右均可居中~~

二，待续~~边练习边随时补充~

0 0