CSS的四個(gè)角對(duì)折，是一種常見(jiàn)的效果，可以通過(guò)CSS屬性來(lái)實(shí)現(xiàn)，讓我們看一下其中的方法。

border-radius: 50%;
transform: rotate(45deg);

上面的代碼就是實(shí)現(xiàn)四個(gè)角對(duì)折的方法，具體來(lái)說(shuō)，他是通過(guò)border-radius屬性來(lái)設(shè)置一個(gè)圓形，所以是50%，這個(gè)值可以根據(jù)實(shí)際情況進(jìn)行調(diào)整，然后使用transform屬性來(lái)對(duì)這個(gè)圓形進(jìn)行旋轉(zhuǎn)，45deg表示旋轉(zhuǎn)45度。

當(dāng)然，這只是其中的一種方式，還有其他的實(shí)現(xiàn)方法，比如使用偽元素來(lái)實(shí)現(xiàn)。

.box {
position: relative;
}
.box:before {
content: "";
display: block;
position: absolute;
width: 50px;
height: 50px;
top: -25px;
left: -25px;
border: 1px solid #000000;
border-width: 1px 1px 0 0;
transform: rotate(45deg);
}

上面的代碼是利用偽元素:before來(lái)實(shí)現(xiàn)四個(gè)角對(duì)折的效果，首先對(duì).box設(shè)置position為relative，然后對(duì)其::before偽元素設(shè)置width和height，并設(shè)置top和left為負(fù)值，表示向上和向左偏移，在設(shè)置border-width時(shí)，只對(duì)左邊和上邊設(shè)置，這樣就可以實(shí)現(xiàn)對(duì)折的形狀，最后使用transform屬性來(lái)進(jìn)行旋轉(zhuǎn)。

無(wú)論采用哪種方法，只要靈活運(yùn)用CSS屬性，就可以實(shí)現(xiàn)各種炫酷的效果。