如何从子部门重叠父部门 [英] How to Overlap Parent Div From Child Div

问题描述

我在我的HTML中有一些div，其中一个是加载图像div，所以我想它重叠其父div。这是我的代码：

I have some divs at my HTML and one of them is loading image div so I want it overlap its parent div. Here is my code:

<div id="something1">
    <div id="something2"></div>
    <div id="parent" style="border: 15px solid #c1c1c1;width:200px; height:250px;">
        <div id="child" style="position: absolute; border: 15px solid #a2f2e2"></div>
    </div>
</div>

当我使用不同的位置（即绝对，相对等）时，子div无法与其父项重叠。这里是我的小提琴链接： http://jsfiddle.net/yNFxj/4/ 我不希望看到父母div的任何内容，但我希望看到子div增加为父母的大小并重叠它。

When I use different positions (i.e. absolute, relative etc.) child div couldn't overlap its parent. Here is my fiddle link: http://jsfiddle.net/yNFxj/4/ I don't want to see anything from parent div but I want to see that child div increased as parent's size and overlapped it.

有关如何使用纯html对其进行标记的任何想法和css和通用的方式来实现它我的任何其他页面？

Any ideas about how can I dot it just with pure html and css and with a generic way to implement it my any other pages?

PS：边框，宽度，高度等只是例如，它可以被删除。

PS: Border, width, height etc. are just for example, it can be removed.

推荐答案

Sajjan与我所能说的最接近，但他有一些缺陷：

Sajjan's the closest from what I can tell, but his has a few flaws:

1. 位置：绝对要求其父母具有非静态位置 position：relative ，它的效果与static相同）。
   
2. 您不需要设置高度和宽度只是父母。

1. Position: absolute requires its parent to have a non-static position (this is often done with position: relative, which effectively works the same way as static).
2. You don't need to set the height and width of the child, just the parent.

这是我的小提琴演示。

#parent {
    border: 5px solid gray;
    position: relative;
    height: 100px;
    width: 100px;
    margin-left: 50px;
}

#child {
    position: absolute;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    background: red;
}

这里的关键是位置：相对在父母身上。

The key here is the position: relative on the parent.

我很好奇，但是，您试图用这个来达到什么目的。我有一种感觉，不管它是什么，都有更好的方法。

I am curious, though, what exactly you're trying to achieve with this. I have a feeling that whatever it is, there's a better way.

这篇关于如何从子部门重叠父部门的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！