CSS中绝对定位

embedded/2025/3/18 3:46:27/

1.如何设置绝对定位?

给元素设置postition: absolute 即可实现绝对定位

可以使用left,right,top,bottom四个属性调整位置

2.绝对定位的参考点在哪里?

    参考他的包含块.

什么是包含块?

        1.对于没有脱离文档流的元素:包含块就是父元素;

         2.对于脱离文档流的元素:包含块是第一个拥有定位属性的祖先元素(如果所有祖先都没有定位,那包含块就是整个页面)

3.绝对定位元素的特点:

1.脱离文档流,会对后面的兄弟元素,父元素有影响;

2.left不能和right一起设置,top和bottom不能一起设置;

3.绝对定位,浮动不能同时设置,如果同时设置,浮动失效,以定位为主.

4.决定定位的元素,也能通过margin调整位置,但不推荐这样做.

5.无论是什么元素(行内,行内块,块级)设置为绝对定位之后,都变成了定位元素(定位元素默认宽和高是被内容撑开,且能自由设置宽高.).


http://www.ppmy.cn/embedded/173481.html

相关文章

uniapp-x 子组件样式覆盖

不支持scoped 默认不支持scoped,所以写也没用 那如果我想修改子孙节点的样式是不是很方便,不需要v-deep了? 的确如此 自带页面样式隔离 在 uni-app x 中,不支持 css scoped,样式的作用范围遵循以下规则:…

Springboot+mybait查询功能撰写

我们写查询首先要考虑&#xff0c;我们需不需要传值&#xff0c;返回些什么&#xff1f;想哈~我们首先前端不需要传入任何东西过来&#xff0c;所以我们方法后面不需要写任何的参数&#xff01;其次&#xff0c;我们要返回什么回去&#xff1f;我们肯定要返回一个List<user&…

【无标题】ffmpeg 合并文件夹下所有视频

(Get-Content "F:\33333333333333\1146523396\videos.txt") | ForEach-Object { "file $_" } | Set-Content "F:\33333333333333\1146523396\videos.txt"这个会把目录下的所有MP4视频文件按文件名写到一个文件。 powershell ffmpeg -f concat -…

RHCE(RHCSA复习:npm、dnf、源码安装实验)

七、软件管理 7.1 rpm 安装 7.1.1 挂载 [rootlocalhost ~]# ll /mnt total 0 drwxr-xr-x. 2 root root 6 Oct 27 21:32 hgfs[rootlocalhost ~]# mount /dev/sr0 /mnt #挂载 mount: /mnt: WARNING: source write-protected, mounted read-only. [rootlocalhost ~]# [rootlo…

Java 学习记录:基础到进阶之路(二)

在 Java 学习的旅程中&#xff0c;我们逐步探索了其丰富的知识体系&#xff0c;从基础的数据类型、字符串操作&#xff0c;到流程控制、运算符的运用&#xff0c;每一步都为我们构建强大的编程能力奠定基石。同时&#xff0c;了解这些知识在 Java 全栈开发中的应用场景&#xf…

Flask中的装饰器Decorator和上下文管理器ContextManager

Flask 中的 装饰器&#xff08;Decorator&#xff09; 和 上下文管理器&#xff08;Context Manager&#xff09; 都用于增强代码的功能&#xff0c;但它们的用途和实现方式不同。 1. 装饰器&#xff08;Decorator&#xff09; 特点 ✅ 用于修改或增强函数/类的行为&#xff…

需求分析、定义、验证、变更、跟踪(高软47)

系列文章目录 需求分析、定义、验证、变更、跟踪 文章目录 系列文章目录前言一、需求分析二、需求定义三、需求验证四、需求变更五、需求跟踪六、真题总结 前言 本节讲明需求分析、定义、验证、变更、跟踪相关知识。 一、需求分析 二、需求定义 三、需求验证 四、需求变更 五、…

Oracle中In和Exists区别分析

在Oracle中&#xff0c;IN和EXISTS都是用于子查询的条件判断&#xff0c;但它们在执行逻辑、性能和应用场景上有显著区别。以下是两者的主要差异&#xff1a; 1.执行机制 IN IN 先执行子查询&#xff0c;将子查询的结果集缓存到内存中&#xff0c;生成一个静态列表。 主查询的…