CSS 可以實現各種各樣的效果，切角就是其中之一。切角是指將一個正方形或矩形的角變為斜切的效果。下面我們來介紹一種實現45度切角的方法。

.cut-corner {
width: 200px; 
height: 200px; 
position: relative; 
overflow: hidden;
}
.cut-corner::before {
content: "";
position: absolute; 
top: 0; 
left: 0; 
width: 100%; 
height: 100%; 
background-color: #f00;
transform: rotate(45deg) translateY(-50%);
transform-origin: 0 0;
}

首先，我們需要一個 div 容器，設置寬高，并開啟溢出隱藏。我們設置容器為相對定位，方便內部偽元素的定位。接著，我們通過 ::before 偽元素實現切角效果。這里設置偽元素的寬高都為100%，并設置背景顏色為紅色。在偽元素上使用 transform 屬性將其旋轉 45 度，并在 Y 軸方向上向上平移，移動距離為自身高度的一半。同時設置旋轉的中心點為左上角。

最后，我們只需要將偽元素插入到容器內部即可實現 45 度切角效果。