首页 > 代码库 > 相对定位和绝对定位
相对定位和绝对定位
相对定位和绝对定位
相对定位:position:relative;
相对定位是让元素在当前位置上移动;
exp:
box{
position:relative;
left:20px;
top:30px;
}
表示让box元素从当前位置开始,向左移动20px;向下移动30px;
绝对定位:position:absolute;
绝对定位是让元素从浏览器的0 0点开始移动;
exp:
box{
position:absolute;
left:20px;
top:30px;
}
表示让元素从浏览器的0 0点开始,向左移动20px,向下移动30px;
注:绝对定位会脱离文档流,行内元素会被自动视为块级元素。
在编写网页时,有一些元素位置特殊,使用浮动难以将其放在对应位置时,可以使用浮动。在使用定位时,需要给元素的父级相对定位,再使用绝对定位给元素设定位置。
exp:
box{
width:200px;
height:200px;
position:relative;
}
box_1{
position:absolute;
left:20px;
top:20px;
}
这段代码就能让box_1这个元素从box元素的0 0点开始,向左下各移动20px;
另:若想让元素固定在某一位置则使用:position:fixed。
相对定位和绝对定位
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。