要用 CSS 制作一個菱形柱，我們可以使用旋轉和傾斜的技巧。下面是基本的 HTML 結構：

接下來是基本的 CSS 代碼：

.diamond {
width: 50px;
height: 50px;
position: relative;
transform: rotate(-45deg);
border: 1px solid black;
}
.diamond:before {
content: "";
position: absolute;
top: -25px;
left: 25px;
width: 50px;
height: 50px;
transform: rotate(45deg) skew(45deg);
border: 1px solid black;
}
.diamond:after {
content: "";
position: absolute;
bottom: -25px;
left: 25px;
width: 50px;
height: 50px;
transform: rotate(45deg) skew(-45deg);
border: 1px solid black;
}

上面的代碼中，我們先讓菱形塊旋轉 -45 度，使它實現(xiàn)菱形的效果。然后，我們創(chuàng)建偽元素 :before 和 :after，分別用于制作菱形的上下兩個面。:before 和 :after 元素使用了相同的寬高和傾斜。當我們對它們進行旋轉時，它們的傾斜被修正，而成為菱形的兩個面。