怎么用css画椭圆

在CSS中，画椭圆有许多不同的方法。以下是其中一些最常用的方法，可以帮助您快速绘制椭圆形形状。

/*方法一：使用 border-radius*/.oval{
    width: 200px;
    height: 80px;
    border-radius: 100px / 40px;
    background-color: #ccc;
}
/*方法二：使用 transform*/.oval{
    width: 200px;
    height: 80px;
    background-color: #ccc;
    transform: scale(1, 0.5);
}
/*方法三：使用伪元素*/.oval{
    position: relative;
    width: 200px;
    height: 80px;
    background-color: #ccc;
}
.oval::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50% / 40%;
    background-color: #ccc;
}
    

以上三种方法都会产生椭圆形状，但根据具体情况您可能更倾向于某种方法。尝试使用不同的方法绘制椭圆形状，并找到最适合您的情况的方法！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！