JavaScript脚本库创建CSS圆角

最新推荐文章于 2017-11-18 09:55:45 发布

iteye_2156

最新推荐文章于 2017-11-18 09:55:45 发布

阅读量115

点赞数

文章标签：脚本 CSS JavaScript Office HTML ViewUI

本文链接：https://blog.csdn.net/iteye_2156/article/details/82007256

版权

JavaScript脚本库创建CSS圆角

2010-12-02 08:44

‍

使用NiftyCube.js脚本库动态的创建css圆角

<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />

NiftyCube.js产生css圆角需要的条件：

1．首先要导入NiftyCube.js及其它的style.css，尤其要注意路径的正确性（这里可以直接在解压了之后的NiftyCube文件夹下进行测试）

NiftyCube.js可以在http://www.html.it/articoli/niftycube/NiftyCube.zip这个网址中下载

2．页面或者是需要产生圆角的parent必须设置有颜色，准确的说应该是两者有对比色，否则看不到效果

完整的代码如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Nifty Corners: Javascript and CSS rounded corners</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="generator" content="HAPedit 3.1">
<style type="text/css">
body{

padding: 30px 0 0;background:#000000;
font: 100.01%/1.3 Verdana,Arial,sans-serif;text-align:center

}
div#box{

width: 18em;padding: 20px;margin:0 auto;
background:#E6E6E6;color:#000

}

</style>
<script type="text/javascript" src="niftycube.js"></script>
<script type="text/javascript">
     window.οnlοad=function(){
        Nifty("div#box","normal");
      }
</script>
</head>
<body>
   <div id="box">
       <h1>Nifty Corners Cube™</h1>
     <p>One call. Two parameters. Three sizes.</p>
</div>
</body>
</html>