html画特殊图形（待修改）

最新推荐文章于 2022-05-07 20:09:08 发布

活好女

最新推荐文章于 2022-05-07 20:09:08 发布

阅读量840

点赞数

本文链接：https://blog.csdn.net/dairenwu/article/details/78066440

版权

1.画圆

<!doctype html>
<html>
    <head>
        <style>
        *{margin:0;padding:0;}
        .box{margin:50px auto;width:100px;height:100px;border-radius:50%;background:pink;}
        </style>
    </head>
<body>
    <div class="box"></div>
</body>
</html>

2.画梯形

<!doctype html>
<html>
    <head>
        <style>
        *{margin:0;padding:0;}
        .box{margin:50px auto;width:200px;height:100px;border-radius:50%;background:pink;}
        </style>
    </head>
<body>
    <div class="box"></div>
</body>
</html>

3.画三角形

<!doctype html>
<html>
    <head>
        <style>
        .box{border:10px solid transparent;border-right:10px solid #56a9d3;}
        </style>
    </head>
<body>
    <div class="box"></div>
</body>
</html>