[CSS] position 相对定位和绝对定位

崛起的配菜

已于 2022-08-15 15:06:39 修改

阅读量688

点赞数 1

分类专栏： CSS常见知识点文章标签： css html html5

于 2022-08-12 15:12:04 首次发布

本文链接：https://blog.csdn.net/Danmon_One/article/details/126299273

版权

CSS position的四个属性值

摘要由CSDN通过智能技术生成

一、position的四个属性值

static：默认值
relative：相对定位
absolute：绝对定位
fixed：绝对定位

二、示例

1、初始状态

HTML部分：

<div class="div1">
        <div class="div11">div11</div>
    </div>
<div class="div2">div2</div>
<div class="div3">div3</div>

CSS部分：

.div1{
    height: 100px;
    width: 500px;
    background-color: blueviolet;
}
.div11{
    height: 50px;
    width: 200px;
    background-color:blue;
}
.div2{
    height: 100px;
    width: 500px;
    background-color:bisque;
}
.div3{
    height: 100px;
    width: 500px;
    background-color:aquamarine;
}