Question

我想在div标签内制作圆角框。我怎样才能做到这一点？你能举个例子吗？

Answer 1

您可以使用CSS：

.rounded-corners {
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
}

然后使用jQuery将类“.rounded-corners”添加到div：

$("#div-id").addClass("rounded-corners");

Answer 2

使用border-radius：10px with CSS。

另请看一下这篇文章：https://stackoverflow.com/questions/521432/best-jquery-rounded-corners-script

Answer 3

我相信你正在寻找border-radius CSS property。 JavaScript与元素的外观无关，只与它们的行为方式无关。

<div style="border-radius:10px;height:100px;width:100px;"></div>

Answer 4

以下是一些安全的浏览器：

.box {
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px; 
}

Answer 5

您可以使用JQuery.Corner.Js来制作div标签中的角落。

首先在'jquery.js'

之后将jquery.corner.js添加到您的页面中

<script src="../JQuery/external/jquery/jquery.js"></script>
<script src="jquery.corner.js"></script>

<script>
    $(document).ready(function () {

        $("#Div1").corner();
        $("#Div2").corner("long");
    });     
</script>


<body>

    <div id="Div1" style="background-color: blue; 
        width: 150px; height: 150px;">
    </div>
    <br />
    <div id="Div2" style="background-color: blue; 
        width: 150px; height: 150px;">
    </div>
    <br />
</body>

您可以在此地址JQuery Corner Demo

中找到更多示例

如何使用jquery在DIV标签内制作圆角框？

5 个答案: