jquery圆角插件我怎么使用

浏览器用的谷歌的最新版本,jquery插件也都引用了的,出来不了效果,贴上代码大家帮我看看,谢谢了

 

<html>
<head>
<meta charset="utf-8" />
<title>jquery圆角插件示例</title>
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/jquery.corner.js"></script>
<style>
* {
margin: 0;
padding: 0
}
.page {
width: 920px;
text-indent: 20px;
}
.top {
background: #ff0000 url(http://www.buger.net/images/light-sky2.jpg);
width: 600px;
height: 100px;
}
.xtop {
background: #FFFFCC;
width: 100%;
height: 100%;
}
.bg {
background: #CC8822;
width: 300px;
height: 100px;
padding: 8px;
}
</style>
</head>
<body>
<script>
$(".top").corner(""); //图片圆角
$(".xtop").corner("round 14px"); //圆角矩形
$(".x1").corner("bevelfold"); //内翻角
//$(".xtop").corner("long 14px"); //内缺外圆矩形
$(".bg").corner("");
</script>
<div class="page">
<div class="top" data-corner="left 20px right 20px"></div>
<br>
<div class="bg" >
<div class="xtop x1" > 土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪 </div>
</div>
</div>
<br>
<div>
<div class="bg" >
<div class="xtop" data-corner="left 5px right 5px"> 土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪土豪 </div>
</div>
</div>
</body>
</html>

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。