没有合适的资源?快使用搜索试试~ 我知道了~
HTML5 层的叠加的实现
2 下载量 89 浏览量
2020-11-19
20:04:52
上传
评论
收藏 27KB PDF 举报
温馨提示
试读
1页
position语法: position : static absolute relative position参数: static : 无特殊定位,对象遵循HTML定位规则 absolute : 将对象从文档流中拖出,使用left,right,top,bottom等属性进行绝对定位。而其层叠通过css z-index属性定义。此时对象不具有边距,但仍有补白和边框 relative : 对象不可层叠,但将依据left,right,top,bottom等属性在正常文档流中偏移位置 position说明: 设置对象的定位方式,可以让布局层容易位置绝对定位,控制盒子对象
资源推荐
资源详情
资源评论
HTML5 层的叠加的实现层的叠加的实现
position语法:
position : static absolute relative
position参数:
static : 无特殊定位,对象遵循HTML定位规则
absolute : 将对象从文档流中拖出,使用left,right,top,bottom等属性进行绝对定位。而其层叠通过css z-index属性定
义。此时对象不具有边距,但仍有补白和边框
relative : 对象不可层叠,但将依据left,right,top,bottom等属性在正常文档流中偏移位置
position说明:
设置对象的定位方式,可以让布局层容易位置绝对定位,控制盒子对象更加准确。
<html>
<head>
<title>层的定位</title>
</head>
<style>
div {height:300;
width:300;
}
#d1 {position:absolute;
background-color:green;
left:2em;
top:2em;
}
#d2 {position:absolute;
background-color:blue;
left:4em;
top:4em;
}
#d3 {position:absolute;
background-color:red;
left:6em;
top:6em;
}
</style>
<body>
<div id="d1">
<div id="d2">
<div id="d3">
</body>
</html>
资源评论
weixin_38689857
- 粉丝: 8
- 资源: 888
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功