虽然CSDN博客提供模版少,但它开放了CSS样式自定义和公告HTML的解析,这里我们利用公告来添加一些CSS和JS代码。方法如下:
一、进入“http://hi.csdn.net/home.html”,点击“我的博客”后的配置按钮。在公告栏处填入你自己的脚本代码,此处以jquery举例。需要特别说明的是。CSDN博客中会引用到“http://blog.csdn.net/js/LoadFeedbackCount.js"这个JS文件,我们打开此文件发现在文件第一行已定义了这样一个函数:
function $(id) {
return document.getElementById(id);
}
此函数与jquery产生了冲突,因些,在我们的脚本的时候就要将"$"改为jQuery了。下面是我我的BLOG,就当示例代码吧。
如果你还不了解jQuery的话,可以到"http://wiki.jquery.org.cn/doku.php"这里去了解。
<link type="text/css" href="http://61.139.77.143:8086/scripts/jquery1.3.1/theme/ui.all.css"
rel="Stylesheet" />
<link href="http://jquery.com/demo/thickbox/thickbox-code/thickbox.css" type="text/css" rel="stylesheet" media="all" />
<script type="text/javascript" src="http://61.139.77.143:8086/scripts/jquery1.3.1/jquery-1.3.1.js"></script>
<script type="text/javascript" src="http://61.139.77.143:8086/scripts/jquery1.3.1/jquery-ui-personalized-1.6rc6.js"></script>
<script type="text/javascript" src="http://61.139.77.143:8086/scripts/jquery1.3.1/thickbox.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery(".aboutauthor").css("width","97%");
/*jQuery(".aboutauthor").each(function(i){
jQuery(this).css("padding-left","40px");
});*/
jQuery(".aboutauthor>dl>dt").css("text-align","center");
jQuery("h6").css("padding-left","50px");
jQuery(".aboutauthor").accordion({ header: "dt" });
jQuery(".gutter").accordion({ header: "h6" });
});
</script>
<p><a href="http://jquery.com/demo/thickbox/images/single.jpg" title="add a caption to title attribute / or leave blank" class="thickbox"><img src="http://jquery.com/demo/thickbox/images/single_t.jpg" alt="Image 2"/></a></p>
以上代码仅供参考,演示用,当然你可以做得更加炫