子div能不能相对于父div绝对定位啊?如何定位?求帮忙,急急急急急急急急急急急

父div设置的是居中的,它的子div能不能根据父div的位置而定位,而不是根据body或者显示器边界定位;
就是说:能不能设置子div在父div里面距离父div左边100px,无论显示器分辨率怎么变子div一直在父div左边的100px处。
或者给出下图的css样式或者是完整的html代码,谢谢。谢谢

<div style="width:500px; height:500px; border:solid 1px #900;">
<div style="width:100px; height:100px; background-color:#900; position:absolute; z-index:11; margin-top:10px; margin-left:10px;">1</div>
<div style="width:100px; height:100px; background-color:#090; position:absolute; z-index:12; margin-top:120px; margin-left:10px;">2</div>
<div style="width:100px; height:100px; background-color:#009; position:absolute; z-index:13; margin-top:10px; margin-left:120px;">3</div>
<div style="width:100px; height:100px; background-color:#990; position:absolute; z-index:14; margin-top:120px; margin-left:120px;">4</div>
</div>
要用margin-left,margin-right,margin-right,margin-bottom属性,而不是直接用top,left,right,bottom这些属性,前者是对父元素的,后者是对整个窗体的。还有z-index的值必须是不一样的,如果是一样的的话,那就表示它们在同一层面上,会相互拥挤。

仅供参考!呵呵
温馨提示:内容为网友见解,仅供参考
第1个回答  2011-05-05
<style type="text/css">
#fu{
background-color:#CCCCCC;
width:80%;
margin:0 auto;
position:relative;
border:1px solid #000000;
height:600px;
}
#zi1,#zi2,#zi3,#zi4{
border:1px solid #CCCCCC;
width:200px;
height:200px;
position:absolute;
background-color:#FFFFFF;
}
#zi1{
top:80px;
left:100px;
}
#zi2{
top:80px;
right:150px;
}
#zi3{
left:100px;
bottom:60px;
}
#zi4{
right:150px;
bottom:60px;
}
</style>
<div id="fu">
<div id="zi1">
子层1
</div>
<div id="zi2">
子层2
</div>
<div id="zi3">
子层3
</div>
<div id="zi4">
子层4
</div>
</div>
第2个回答  2011-05-04
修改父div样式的padding属性即可:
padding-top:80px;
padding-left:100px;
padding-right:150px;
padding-bottom:60px;
第3个回答  2011-05-06
父级元素使用相对定位,position:relative; 这样子元素的绝对定位才会以父元素做为定位对象。
绝对定位的对象,别忘记设定z-index来表示层级。
第4个回答  2011-05-05
如果用position来定位你的页面,父级元素的position属性必须为相对定位(relative),定位于其内部的某个元素,最好用绝对定位(absolute),这样,它就不受父级元素的padding值的影响。下面给段代码,供参考:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>网页中css定位的问题</title>
<style type="text/css">
*{margin:0;padding:0;}
#wrapper{width:800px;height:600px;margin:0 auto;position:relative;background:#f00;}/*相对定位position:relative;都以它为参照.*/
#one,#two,#three,#four{width:180px;height:180px;background:#ccc;}
#one{position:absolute;left:100px;top:80px;}/*绝对定位position:absolute;,设置left和top */
#two{position:absolute;right:150px;top:80px;}/*绝对定位position:absolute;,设置right和top */
#three{position:absolute;left:100px;bottom:60px}/*绝对定位position:absolute;,设置left和bottom */
#four{position:absolute;right:150px;bottom:60px;}/*绝对定位position:absolute;,设置right和bottom */
</style>
</head>
<body>
<div id="wrapper">
<div id="one">111区域</div>
<div id="two">222区域</div>
<div id="three">333区域</div>
<div id="four">444区域</div>
</div>
</body>
</html>

DIV相对于父DIV绝对定位
父级的相对定位:是要把子DIV的绝对定位的起点以父DIV左上角为起点,如果没有就默认屏幕左上角了。子DIV的绝对定位:是无视父DIV下别的元素。然后就是left:0; top:0; 这个是用来定位的 希望对你有帮助

CSS 父级div绝对定位影响子级div的问题
div定位问题,absolute,绝对定位,是对整个页面来说的,一般父级的div用相对定位,子级的div用绝对定位就肯定不会错的,你可以试一试!

CSS,DIV:关于父DIV和子DIV
不能这样的。应该是为父级DIV相对定位:relative ,然后,子级DIV才能以父级DIV为参考定位。通常做法是为父级相对定位,然后里面的子父可使用相对或绝对定位法定位。

绝对定位和相对定位到底怎么使用
绝对定位和相对定位这个视情况而定了..字div和父div可以用margin定位。div有个很重要的属性就是float。。div的浮动属性。div层经常会乱跑。所有个人认为在设置div位置时候用相对定位比较好。。就比如说,子div定位要以父div为参照物

DIV怎么定位两个div?
用绝对定位,把两个都放在一个大的DIV里面,大的设置成position:relaitve。第一个小DIV属性设置成为position:absolute; z-index:1。第二个小DIV属性设置成为position:absolute; z-index:2。width、height、left和top视情况而定。注:1、父级div用相对定位position:relative,子级div用绝对定位position:...

HTML中DIV的相对定位与绝对定位如何操作?
当一个DIV块的位置被定义为绝对定位的时候,也就意味着它失去了文档流的位置,后面的文档流会紧跟着补上来接替它的位置。如果上下左右的绝对偏移量都是零,那么它将漂浮在原来的位置上。否则就会以浏览器的上下左右四边为基准进行偏移。相对定位(relative):当设了相对的偏移量之后,这个DIV原来所占据的...

CSS样式中如何理解绝对定位和相对定位?
绝对定位表示不管是几级元素,都以浏览器上边框(top),左边框(left),右边框(right),下边框(bottom)来定位..相对定位,则是以上一级父级元素为基准来定位.. 所以子div相对父div的定位用什么当然就要用 position:relative--相对定位了..margin表示 与上一级元素的上下左右之间留多少空间,如果是在相对定位...

div中的相对定位与绝对定位
layer-background-image Netscape 的 DIV 的背景图象。 ● 2.绝对定位和相对定位 (position) 绝对定位: 定位属性将是网虫们打开幸福之门的钥匙: H4 { position: absolute; left: 100px; top: 43px } 这项CSS规则让浏览器将H4的起始位置精确地定在距离浏览器左边100象素,距离其顶部43象素的位置。注意这里唯一...

DIV布局用绝对定位好还是用相对定位好?
相对定位的元素属文档流,所以稳定的,相对定位是相对他该出现的位置,如无设top left之类,和普通基本一样。一般的绝对定位是这样用的,父元素要是相对定位的且须有布局,如有个高度,这样子元素用绝对定位,就可以相对它的父元素进行绝对定位,父元素若不这样做,那么子元素用绝对定位其实是相对body...

Css,div:相对定位和绝对定位的问题…我这么理解的对吗?
相对定位和绝对定位都是相对于父级而言,如果父级有定位(就是父级指定了相对或绝对定位),top、left等就是相对于父级,如果父级没定位,就相对于body。区别仅仅是相对定位在父级占位置,绝对定位不占位置。

相似回答