首页 > 代码库 > CSS格式与布局中三种位置的理解与应用
CSS格式与布局中三种位置的理解与应用
第一种位置关系:position:fixed 锁定位置(相对于整个浏览器的位置),常用在各大网站的右下角或其它位置的小广告。
如果需要调整锁定位置,需要使用如下方式:<div style="width:300px; height:300px; position:fixed; top:0px; left:0px; right:0px; bottom:0px" ></div>
第二种位置关系:position:absolute 绝对位置(相对于父级元素--浏览器,绝对定位的上级)
(1)最外边没有absolute,则调整时div相对于浏览器变化;(2)最外面有absolute,则调整时div相对于最外层边界变化。
如果需要调整绝对位置,需要使用如下方式:<div style="width:300px; height:300px; position:absolute; top:0px; left:0px; right:0px; bottom:0px" ></div>
第三种位置关系:position:relative 相对位置(相对于自身应该出现的位置)
如果需要调整相对位置,需要使用如下方式:<div style="width:300px; height:300px; position:relative; top:0px; left:0px; right:0px; bottom:0px" ></div>
CSS格式与布局中三种位置的理解与应用
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。