当前位置: 首页 > news >正文

【CSS】absolute定位的默认位置

position: absolute; 属性会使元素脱离正常的文档流,并相对于最近的非 static 定位祖先元素进行定位。如果没有这样的祖先元素,则相对于初始包含块(通常是视口)进行定位。

但是当topleft没有指定具体值时,元素的在上下文中的位置会在默认position: relative时应该存在的位置,不过由于脱离了文档流,层级会高。

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title></head><body><div style="background-color: antiquewhite"><div style="width: 100px; height: 100px; background-color: red"><div style="width: 100%; height: 100%"></div><divstyle="position: absolute;width: 20px;height: 20px;background-color: blue;"></div></div><div style="width: 100px; height: 100px; background-color: red"><div style="width: 100%; height: 100%"></div><divstyle="position: absolute;width: 20px;height: 20px;background-color: blue;"></div></div></div></body>
</html>

http://www.lryc.cn/news/483771.html

相关文章:

  • 遗传算法与深度学习实战——利用进化计算优化深度学习模型
  • 计算机视觉 ---图像读取与显示(OpenCV与Matplotlib)
  • XML Schema 字符串数据类型
  • Spring Boot 读取 yml 并映射至实体
  • /// ts中的三斜线指令 | 前端
  • 什么岗位需要学习 OpenGL ES ?说说 3.X 的新特性
  • 【插件】多断言 插件pytest-assume
  • ctfshow DSBCTF web部分wp
  • 三维点云 和模型转换的问题
  • 黑马智数Day7
  • 虚拟机安装Ubuntu 24.04服务器版(命令行版)
  • .net core开发windows程序在国产麒麟操作系统中运行
  • 【LinuxC编程】06 - 守护进程,线程
  • <websocket><PLC>使用js和html实现webscoket,与PLC进行socket通讯的实例
  • nginx部署H5端程序与PC端进行区分及代理多个项目及H5内页面刷新出现404问题。
  • blenderFds代码解读
  • 亚马逊评论爬虫+数据分析
  • 新手小白学习docker第六弹------Docker常规安装(安装tomcat、mysql、redis)
  • ReactPress与WordPress:两大开源发布平台的对比与选择
  • 机器情绪及抑郁症算法
  • 01-Ajax入门与axios使用、URL知识
  • 第四十五章 Vue之Vuex模块化创建(module)
  • [2024最新] macOS 发起 Bilibili 直播(不使用 OBS)
  • Netty实现WebSocket Client三种典型方式
  • 软间隔支持向量机
  • 在C++上实现反射用法
  • 【学术会议介绍,SPIE 出版】第四届计算机图形学、人工智能与数据处理国际学术会议 (ICCAID 2024,12月13-15日)
  • 网络百问百答(一)
  • 【深圳大学】数据结构A+攻略(计软版)
  • 解读《ARM Cortex-M3 与Cortex-M4 权威指南》——第4章 架构