如何制作圆角的div

问题描述 投票:0回答:6

如何制作一个 div 使其边框角为圆角?

html rounded-corners
6个回答
33
投票

这是:

<style type="text/css">
div.test
{
    width: 115px;
    padding: 10px;
    border: 2px solid #000;
    border-radius: 15px;
    -moz-border-radius: 15px;
}
</style>
<div class="test">This is some text!</div>

12
投票

使用

border-radius
属性。指定的数量越高(通常为
px
),您的形状就越圆。示例:

myDiv { border-radius:30px;}

希望有帮助。


8
投票

添加这个CSS:

border-top-right-radius:15px;
border-top-left-radius:15px;
border-bottom-right-radius:15px;
border-bottom-left-radius:15px;

6
投票

使用 CSS 添加代码:

border-radius: 10px

我使用 10px 为例,但您可以尝试使用您喜欢的像素数量。


1
投票

如果你不想依赖像素,你可以随时使用%

border-radius: 50%;


0
投票

只需使用

"border-radius"
css 属性,如下所示:

div {
     border-radius:8px;
}
© www.soinside.com 2019 - 2024. All rights reserved.