css如何制作圆?

使用css制作圆形,我们需要使用到一个关键属性:border-radius。下面我们来看一下css制作圆的方法。

border-radius 属性是一个简写属性,用于设置四个 border-*-radius 属性。

提示:该属性允许您为元素添加圆角边框!

语法:

border-radius: 1-4 length|% / 1-4 length|%;

注释:按此顺序设置每个 radii 的四个值。如果省略 bottom-left,则与 top-right 相同。如果省略 bottom-right,则与 top-left 相同。如果省略 top-right,则与 top-left 相同。

属性值:

  • length 定义圆角的形状。

  • % 以百分比定义圆角的形状。

示例:

<html>
<head>
<style>
div{
            width:100px;
            height:100px;
            border:1px solid #ccc;
            border-radius:50%;
        }
</style>
</head>
<body>
<div></div>
</body>
</html>

效果图:

2.jpg-600

以上就是css如何制作圆?的详细内容,更多请关注0133技术站其它相关文章!

赞(0) 打赏
未经允许不得转载:0133技术站首页 » CSS3 答疑