CSS橢圓形代碼
使用CSS可以實現各種各樣的效果,其中橢圓形也不例外。下面是一些常見的CSS橢圓形代碼:
/* 橢圓形 */ .ellipse { width: 100px; height: 50px; border-radius: 50%; } /* 圓形 */ .circle { width: 100px; height: 100px; border-radius: 50%; } /* 橢圓形外邊框 */ .border-ellipse { width: 100px; height: 50px; border: 2px solid black; border-radius: 50%; } /* 圓形外邊框 */ .border-circle { width: 100px; height: 100px; border: 2px solid black; border-radius: 50%; }
以上代碼中,border-radius
屬性用來設置邊框的圓角大小。當設置為50%時,就可以創建一個橢圓形或圓形。
如果要給橢圓形或圓形加上外邊框,可以使用border
屬性,同時設置合適的寬度和顏色即可。
通過上面的代碼,可以輕松實現各種橢圓形和圓形效果,非常實用!
上一篇css框架怎么設計開發