在網站設計中，通過對元素進行各種樣式的設置，可以實現豐富的交互效果。在這些效果中，正方形特效是較為常見且簡單易用的一種特效。下面將介紹如何使用 CSS 實現正方形特效。

.square{
width: 100px;
height: 100px;
background-color: #f00; 
transition: transform .3s ease-out;
}
.square:hover{
transform: rotate(45deg);
}

在上述代碼中，首先定義一個 .square 的類，指定元素的寬度、高度以及背景色。接著，通過添加transition屬性，定義元素變形的速度和效果。最后在 :hover 偽類下，定義元素的旋轉變形。

值得注意的是，在正方形特效中，元素要求寬度和高度相等。通過定義相同的寬度和高度，可以使元素達到正方形的效果。在不同的實際應用場景中，可以調整上述代碼中的元素屬性，例如改變顏色、字體等等，來滿足不同的需求。