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. 总结

相关推荐
爷_19 分钟前
字节跳动震撼开源Coze平台!手把手教你本地搭建AI智能体开发环境
前端·人工智能·后端
charlee442 小时前
行业思考:不是前端不行,是只会前端不行
前端·ai
Amodoro3 小时前
nuxt更改页面渲染的html,去除自定义属性、
前端·html·nuxt3·nuxt2·nuxtjs
Wcowin3 小时前
Mkdocs相关插件推荐(原创+合作)
前端·mkdocs
伍哥的传说4 小时前
CSS+JavaScript 禁用浏览器复制功能的几种方法
前端·javascript·css·vue.js·vue·css3·禁用浏览器复制
lichenyang4534 小时前
Axios封装以及添加拦截器
前端·javascript·react.js·typescript
Trust yourself2434 小时前
想把一个easyui的表格<th>改成下拉怎么做
前端·深度学习·easyui
三口吃掉你4 小时前
Web服务器(Tomcat、项目部署)
服务器·前端·tomcat
Trust yourself2434 小时前
在easyui中如何设置自带的弹窗,有输入框
前端·javascript·easyui
烛阴4 小时前
Tile Pattern
前端·webgl