.wrap {
  padding: 20px;
  display: flex;
  flex-wrap: wrap;
}

.ele1,
.ele2,
.ele3,
.ele4 {
  height: 100px;
  width: 100px;
  border: 1px solid black;
  margin: 50px;
}
.ele1 {
  box-shadow: 5px 5px 5px 5px black; // x偏移 y偏移 模糊半径 扩散半径 颜色
}
.ele2 {
  box-shadow: 5px 5px 5px black; // x偏移 y偏移 模糊半径 颜色
}
.ele3 {
  box-shadow: 5px 5px black; // x偏移 y偏移 颜色
}
.ele4 {
  box-shadow: inset 5px 5px black; // 阴影在内部
}