CSS定位：通过负边距定义的关联位置

如何使框重叠和偏移顶部和左侧5px一个接一个只使用css

请检查上连杆

我认为它可以用一种样式定义，不需要定义每个框的位置

你能帮我调整一下吗

HTML

---

非常感谢你

最小化标记并使用方框阴影怎么样

这允许您仅声明单个卡片元素，并使用多个方框阴影：

.持有人{ 位置：绝对位置； 顶部：100px； 左：100px； 显示：块； 字号：0； } .卡片{ 位置：相对位置； 背景：红色； 不透明度：0.4； 宽度：40px； 高度：60px； 利润上限：-55px； 左边距：-35px； 长方体阴影：5px 5px rgba255,0,0,0.4,10px 10px rgba255,0,0,0.4,15px 15px rgba255,0,0,0.4,20px 20px rgba255,0,0,0.4； }

<div class="holder">
    <div class="card" ></div>
    <div class="card" ></div>
    <div class="card" ></div>
    <div class="card" ></div>
</div>

.holder{
position:absolute;
top:100px;
left:100px;
display:block; 
font-size: 0;
}
.card{
position:relative;
background:red;
opacity: 0.4;
width:40px;
height:60px;
margin-top:-55px;
margin-left:-35px;
}