当先锋百科网

首页 1 2 3 4 5 6 7

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属性,同时设置合适的宽度和颜色即可。

通过上面的代码,可以轻松实现各种椭圆形和圆形效果,非常实用!