面试官：介绍一下CSS定位？absolute和relative分别依据什么定位？

卡皮巴拉

已于 2023-09-01 18:27:10 修改

阅读量905

点赞数 4

分类专栏： Web前端开发面试题（以练带学）文章标签： html 前端 css 学习面试

于 2023-09-01 14:08:08 首次发布

本文链接：https://blog.youkuaiyun.com/upgrade_bro/article/details/132622087

版权

能说服一个人的，从来不是道理，而是南墙。

一、position属性介绍

取值	名称	效果
static	静态定位(默认值)	元素按照标准流布局 (不脱标) , top、bottom、left 、right等属性不起作用
relative	相对定位	元素按照标准流布局 (不脱标) ，可以通过top、bottom、left 、right进行定位，定位参照对象是自身在标准流布局中的位置
absolute	绝对定位	元素脱离标准流（脱标），可以通过top、bottom、left 、right进行定位，定位参照对象是最邻近的祖先定位元素，如果找不到这样的父级元素，参照对象是视口。定位元素（positioned element），position值不为static的元素，也就是position值为relative、absolute、fixed的元素
fixed	固定定位	元素脱离标准流（脱标）