美文网首页
怎么设置 一个基础的圆形

怎么设置 一个基础的圆形

作者: 梦回98 | 来源:发表于2019-06-19 00:11 被阅读0次

    按下面我们就来学习怎么把一个正方形盒子变成一个圆形盒子。
    首先我们是要建一个有宽高的盒子,给它一个外边框颜色。

    div{
    width:100px;
    hieght:100px;
    border:1px  solide   blue;
    }
    

    一个盒子的宽高设置好了,那接下来该怎么就是看圆角度数了。

    border-radius:
    /圆角弧度/       px
    

    我们都知道一个盒子都有四个边,那吧盒子边成一个圆,那在圆角度数后面就要写上四个属性值:上 右 下 左。
    你要设置一个很规范的圆的话,给它四个边的属性值必须是一样的。

    如图所示:

     border-radius: 90px 90px 90px  90px;
    它这四个边的数值必须比原先盒子的边的数值一半大;100px的话就是>50px的话就可以了。
    

    你们自己可以尝试着做一下这种简易版的圆。

    相关文章

      网友评论

          本文标题:怎么设置 一个基础的圆形

          本文链接:https://www.haomeiwen.com/subject/rascqctx.html