今天小编跟大家讲解下有关浅谈css position absolute相对于父元素的设置方式 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关浅谈css position absolute相对于父元素的设置方式 的相关资料，希望小伙伴们看了有所帮助。
大家知道css的position absolute默认是根据document来设置的 比如position:absolute后设置left:0;top:0这时候元素会显示到页面的左上角。
有时候我们需要在父元素的容器内设置相对的绝对位置
要做到这一点需要把父元素的position属性设置为relative 设置为relative之后不设置left和top属性 这时候父元素虽然是relative的 但是还是在原来位置。 然后把子元素的位置position设置为absolute的 并设置其left top right bottom属性 这样就是相对于父元素的绝对位置了。
如下html示例代码：
<!doctype html><html> <style type="text/css"> #father { position: relative; width:600px; margin:auto; height:400px; border:1px solid red; } #son1 { position: absolute; top: 0; background:#f0f0f0; } #son2 { position: absolute; bottom: 0; background:blue; } </style> <body> <div id="father"> <div id="son1">I am son1</div> <div id="son2">I am son2</div> </div> </body></html>以上就是本文的全部内容 希望对大家的学习有所帮助 也希望大家多多支持爱蒂网。
来源：爱蒂网
![全明星街球派对汤普森趣味答题答案攻略 汤普森趣味答题题库答案一览[多图]](http://www.xyrl.com/file/upload/202406/13/190022901.jpg)
