HTML5 定位网页元素

1. 定位(position)

position:static(标准)

position:relative(相对定位)

偏移量的方向

相对定位的规律

浮动元素设置相对定位

position:absolute(绝对定位)

绝对定位的规律

绝对定位不偏移

2. 固定定位(fixed)

可以发现,给body加了高度后,绝对定位div1跑到body的右下角了,而固定定位div2依旧在浏览器框的右下角。

3. 三种定位的特性

相对定位(relative)

绝对定位(absolute)

固定定位(fixed)

4. 重叠优先级(z-index)

5. 网页元素透明度(opacity)

6. 总结

相关推荐
一个有故事的男同学7 分钟前
从零打造专业级前端 SDK (一):架构与工程化
前端·架构
小胖霞9 分钟前
node全栈系列(七)-增加验证码登录
前端·vue.js·node.js
A242073493038 分钟前
js流程控制语句
开发语言·前端·javascript
AAA阿giao1 小时前
JavaScript 执行机制深度解析:从 V8 引擎到作用域链、变量提升与闭包的全面剖析
前端·javascript·面试
一水鉴天1 小时前
整体设计 定稿 之19 拼语言表述体系之2(codebuddy)
大数据·前端·人工智能·架构
低代码的未来1 小时前
React CVE-2025-55182漏洞排查与修复指南
前端
软件技术NINI1 小时前
html css js网页制作成品——陈都灵html+css 5页附源码
javascript·css·html
脾气有点小暴1 小时前
CSS position 属性
前端·css
ohyeah1 小时前
用原生 JS 手写一个“就地编辑”组件:EditInPlace 的 OOP 实践
前端·javascript
timeweaver1 小时前
React Server Components 的致命漏洞CVE-2025-55182
前端·安全