Html 我想在另一个正方形中设置一个固定宽度和高度的正方形

我有一个父div，里面有一个子div

CSS

---

现在我想在不改变宽度和高度的情况下，将子对象精确地设置在父对象的中间，我该怎么做呢？谢谢。

这里有一个解决方案，但我不确定它是否适合您的需要：

.parent {
    background-color: red;
    width: 500px;
    height: 300px;
    margin: 0 auto;
}

.child {
    background-color: yellow;
    width: 200px;
    height: 100px;
    /* changes */
    top: 100px;
    position: relative;
    margin: 0 auto;
}

---

我想这就是你想要的

---

我自己想出来，我只需要定位：溢出；家长，然后加上一些边距，我们可以把孩子放在中间。

基本上不用位置：相对，谢谢

.parent {
    background-color: red;
    width: 500px;
    height: 300px;
    margin: 0 auto;
}

.child {
    background-color: yellow;
    width: 200px;
    height: 100px;
    /* changes */
    top: 100px;
    position: relative;
    margin: 0 auto;
}

.parent {
    background-color: red;
    width: 500px;
    height: 300px;
    margin: 0 auto;
    position:relative;
    display:block;

}
.child {
    background-color: yellow;
    width: 200px;
    height: 100px;
    position:absolute; top:50%; margin-top:-50px;
    left:50%; margin-left:-100px;
}