CSS怎么弄菱形？

菱形可以用CSS中的transform屬性和偽類來實現。例如，可以使用transform: rotate(45deg);將一個正方形旋轉45度，然后使用偽類在容器中添加border樣式，然后設置不同的寬度和高度即可創建菱形。以下是具體步驟：</br>
1. 創建一個正方形容器</br>
2. 使用transform：rotate(45deg);將其旋轉45度。</br>
3. 使用偽類before和after在容器中創建兩個菱形。</br>
4. 對偽類進行定位，然后設置寬度和高度不同的邊框來創建菱形效果。</br>

下面是樣例代碼：

.diamond-container {
width: 100px;
height: 100px;
background-color: #f00;
transform: rotate(45deg);
position: relative;
}
.diamond-container:before, .diamond-container:after {
content: '';
position: absolute;
width: 0;
height: 0;
border: 50px solid transparent;
}
.diamond-container:before {
border-top-color: #f00;
top: -50px;
left: 0;
}
.diamond-container:after {
border-bottom-color: #f00;
bottom: -50px;
left: 0;
}