CSS3是一種強大的標記語言,可以用來實現許多美麗的效果,例如用CSS3畫圓。
.circle { width: 200px; /* 圓的直徑 */ height: 200px; border-radius: 50%; /* 圓形 */ background-color: #f00; /* 圓的顏色 */ }
如上所示,只需設置寬度、高度、圓角半徑和背景顏色四個屬性,就可以用CSS3輕松地創建一個圓形。
這里我們也可以加上一些過渡效果,讓圓更加優美。例如鼠標移入時改變顏色:
.circle:hover { background-color: #00f; /* 圓的顏色 */ transition: background-color 0.5s ease; /* 過渡效果 */ }
以上代碼表示當鼠標移入圓形時,背景顏色會在0.5秒內緩慢地從紅色過渡到藍色,使得圓形更具吸引力。
總結來說,CSS3可以用來輕松繪制美麗的圓形,并具有許多過渡效果來優化它們。