html+css新手入门：圆角的使用方法详情，常见工作场景；

系列文章目录

html+css新手入门：圆角的使用方法详情；

文章目录

• 系列文章目录
• 前言
• 一、圆角是什么？
• 二、使用步骤
  • 1.引入库
  • 2.读入数据
• 总结

---

前言

随着世界的不断发展，前端这门技术也越来越重要，很多人都开启了学习前端的学习，本文就介绍了前端学习的基础内容。

一、圆角是什么？

可以吧四个角变得更美观圆润；

二、使用步骤

1.引入

代码如下（示例）：

 

 

    <style>

        .sex1{

            margin: 50px auto;

            width: 300px;

            height: 300px;

            background-color:blue;

            border-radius: 50%;

        }

        /* 胶囊按钮:

            1.需要时长方形

            2.border-radius：盒子宽度的一半（50%）        

        */

        .sex2{

            margin: 100px auto;

            width: 200px;

            height: 100px;

            background-color: green;

            border-radius: 50px;

        }

    </style>

总结

以上就是今天要讲的内容，本文仅仅简单介绍了圆角的使用，后续我们还会提供大量的的入门教程，欢迎大家学习！