如何让父容器拥有position:relative属性，但仍然可以添加子元素？

可以使用position:absolute属性和top、left属性来解决。具体代码如下所示：

HTML代码：

<div class="parent"> <div class="child"></div> </div>

CSS代码：

.parent{ position: relative; width: 200px; height: 200px; background-color: #ccc; }

.child{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50%; height: 50%; background-color: #999; }

在上述代码中，父容器parent拥有position:relative属性，子元素child则使用position:absolute属性，并通过top、left和transform属性来让它处于父容器的正中间。这样就可以让父容器拥有定位属性，而子元素仍然可以添加进去。