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
属性,同时设置合适的宽度和颜色即可。
通过上面的代码,可以轻松实现各种椭圆形和圆形效果,非常实用!