老李's Blog

刚花了一点时间对我的这个博客进行了一些美化，效果还不错。虽然CSDN的博客提供了很多种皮肤，但总觉得这些皮肤并不怎么好看。今天看了一个国外的BLOG，觉得挺漂亮的，而CSDN的博客有自定义CSS的功能，于是萌生了模仿的想法。

我挑选的基本皮肤是Simple，这个皮肤的结构跟我要模仿的博客结构比较相似。应用后打开我的博客首页，查看源代码，然后在自定义CSS里对相关的样式进行重新定义。

自定义CSS样式如下，喜欢我这个风格的朋友可以把以下样式拷到自己的自定义CSS里，再把皮肤设置为“Simple”即可：

本风格在FIREFOX下浏览惨不忍睹！

body{...}{background:#3F5D72;margin:0;text-align:center;}
body,td,th{...}{font-size:12px}
p{...}{font-size:13px}
a:link,a:visited{...}{color:#3F5D72;text-decoration:underline}
a:hover{...}{color:#A80101;text-decoration:underline;background:#fff}
.pagelayout{...}{margin:0 auto;border:5px solid #334B5B;padding:2px;width:720px;background:#fff;}
.header{...}{background:#A80101;text-align:left;color:#fff;height:70px;padding-left:10px}
#Header1_HeaderTitle{...}{background:#A80101;color:#fff;margin:10px 0px 10px 10px;text-decoration:none}
.leftcolumn{...}{padding:2px 5px;}
.innerleftcolumn{...}{padding:0}
.postTitle {...}{border-left:5px solid #718A9C;background:#f0f0f0;padding:3px;}
.postTitle a:link,.postTitle a:visited,.postTitle a:hover{...}{color:#A80101;background:#f0f0f0;text-decoration:none;}
.postText{...}{font-size:13px;padding:10px 0px}
.centercolumn{...}{background:#F0F0F0;text-align:center;padding:10px;width:200px}
.listtitle{...}{border-left:5px solid #718A9C;background:#A80101;padding:2px;}
.list{...}{background:#E4E4E4;}
.listitem a,.listitem a:visited{...}{color:#000;background:#e4e4e4;font-weight:normal}
.listitem a:hover{...}{color:#A80101;background:#e4e4e4}

#MyLinks1_HomeLink,#MyLinks1_PersonalHome,#MyLinks1_PersonalResume,#MyLinks1_ContactLink,#MyLinks1_Syndication,#MyLinks1_XMLLink,#MyLinks1_FeedLink,#MyLinks1_HyperLink1,#MyLinks1_Admin{...}{background:#E4E4E4;font-size:13px;color:#000;text-decoration:underline;font-weight:bold}

#footer{...}{background:#f0f0f0;font-size:12px;border-top:3px solid #cbcbcb;clear:both}

技术学习 博客美化