在CSS中，我們可以通過(guò)使用偽元素和CSS屬性來(lái)創(chuàng)建兩個(gè)圓形，并使其交錯(cuò)排列，以下是一個(gè)示例代碼：

HTML部分：

<div class="circle-container">
  <div class="circle"></div>
  <div class="circle"></div>
</div>

CSS部分：

.circle-container {
  position: relative;
  width: 200px;
  height: 200px;
}
.circle {
  position: absolute;
  width: 100px;
  height: 100px;
  border-radius: 50%;
}
.circle:first-child {
  background-color: #333;
  top: 0;
  left: 0;
}
.circle:last-child {
  background-color: #666;
  top: 50px;
  left: 50px;
}

在這個(gè)示例中，我們創(chuàng)建了一個(gè)名為circle-container的容器，用于容納兩個(gè)圓形，每個(gè)圓形都使用circle類(lèi)，并通過(guò)偽元素first-child和last-child來(lái)區(qū)分它們的樣式，我們?cè)O(shè)置每個(gè)圓形的背景顏色、寬度、高度和邊框半徑，并使用position: absolute;來(lái)定位它們，通過(guò)調(diào)整top和left屬性，我們可以控制兩個(gè)圓形的相對(duì)位置，從而實(shí)現(xiàn)交錯(cuò)排列的效果。