CSS 穿透效果是一種常用的 CSS 技巧，常用于實現圓形布局。

.parent {
width: 200px;
height: 200px;
background-color: white;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
}
.parent::before {
content: '';
width: 150px;
height: 150px;
background-color: red;
border-radius: 50%;
position: absolute;
z-index: -1;
}

該代碼實現了一個紅色的圓，穿透了一個白色的圓形容器。這是通過使用::before偽元素選擇器在容器內創建一個圓形元素。設置它的position為 absolute，可以使它獨立于其他元素并且在容器內居中。然后，設置該元素的z-index為 -1，因此它位于容器下方并且可見。

使用這種技術，您可以輕松地創建復雜的圓形布局。