如何使用jquery在DIV標籤內製作圓角框？

我想在div標籤內製作圓角框。我怎樣才能做到這一點？你能舉個例子嗎？如何使用jquery在DIV標籤內製作圓角框？

2012-01-12 Someone

的可能重複[什麼是最好的方法來創建圓角添加到您的網頁jquery.corner.js使用CSS？]（http://stackoverflow.com/questions/7089/what-is-the-best-way-to-create-round-corners-using-css） – 2012-01-12 07:56:18

您可以使用CSS：

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

然後使用類「.rounded來訪者」添加到您的div的jQuery：

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

來源

2012-01-12 07:34:39

'border-radius'和'box-陰影「不再需要供應商前綴。請參閱：[MDN瀏覽器兼容性表格]（https://developer.mozilla.org/en/CSS/border-radius#Browser_compatibility） – 2012-01-12 07:37:39

在CSS中使用border-radius：10px。

也看看這個帖子：https://stackoverflow.com/questions/521432/best-jquery-rounded-corners-script

來源

2012-01-12 07:33:15 Marle1

我相信你正在尋找border-radius CSS property。 JavaScript與元素的外觀無關，只是它們如何行事。

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

來源

2012-01-12 07:35:04

下面是一些瀏覽器的安全方式：

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

來源

2012-01-12 07:37:19 Gaelen

你可以在div標籤使用JQuery.Corner.Js make的角落。

在第一步後「的jquery.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

來源

2015-05-28 17:28:14

如何使用jquery在DIV標籤內製作圓角框？

回答

相關問題