利用CSS美化Blog文章
本文地址: <script type="text/javascript"> var path=document.URL; document.write(document.URL) </script>
发布于 <script type="text/javascript"> var path=document.URL; date=path.substring(40,44); month=path.substring(45,47); day=path.substring(48,50); document.write(date+'年'+month+'月'+day+'日'); </script>
这是我使用的CSS
<style type="text/css">
/*正文区域*/
#GreenerycnBody{
padding-top:10px;
clear:both;
letter-spacing:1px;/*字符间距 */
}
/*链接样式*/
#GreenerycnBody .link{
width:90%;
font-family:tahoma;
font-size:9pt;
line-height:100%;
text-transform:lowercase; /*小写显示 */
}
#GreenerycnBody a,#GreenerycnBody a:link,#GreenerycnBody a:active {
font-weight:bold;
text-decoration: none;
color: green;
}
#GreenerycnBody a:hover {
text-decoration: underline;
color: green;
}
/* 层样式 */
#GreenerycnBody div{
border:solid 1px #78A3D3;
background-color:#F5F8FC;
word-break:break-all;
overflow:auto;
padding:15px;
margin:15px 0;
}
/* 总标题 */
#GreenerycnBody h1{
font-size:23px;
padding:10px 0;
font-family:Verdana, Arial, Sans-Serif;
border-bottom:dashed 1px gray;
text-align:center;
background-color:#F5F8FC;
height:40px;
letter-spacing:0px;/*字符间距 */
}
/*发布日期 */
#GreenerycnBody .fooTime{
margin:0;
padding-top:5px;
text-align:center;
font-size:12px;
line-height:1em;
font-family:Verdana, Arial, Sans-Serif;
border:none;
}
/* 标题 */
#GreenerycnBody .title{
font-size:16px;
font-family:宋体;
TEXT-ALIGN: center;
font-weight:bold;
}
/* 段落 */
#GreenerycnBody p{
font-family: Verdana, Arial, Sans-Serif;
text-indent:2em;
line-height:100%;
font-size:11pt;
whiteSpace:normal;
letter-spacing:1px;/*字符间距 */
}
/* 一个蓝色的代码框 */
#GreenerycnBody .code {
font-family:"Verdana" , "Courier New", "Courier", "mono";
font-size: 12px;
line-height: 18px;
color: #000000;
background-color: #DDEDFB;
margin: 5px;
padding: 5px;
border: 1px solid green;
display:block;
}
#GreenerycnBody blockquote{
background-color:lightyellow;
border:1px dotted #dedbde;
padding:10px;
}
/* 脚注 */
#GreenerycnBody .foot{
height:43px;
padding:12px 0 0 0;
text-align:center;
margin:30px 0 0 0;
font-size:12px;
border:none;
border-top:dashed 1px gray;
}
</style>
/********************************* * Greenerycn Blog Css * * * * Date: 2008-2-21 * * Last Modified Date: * * 2008-2-21 * * * * Contact:greenerycn@gmail.com * * copyright:创作共享 非商业 * * * *********************************/
/*正文区域*/
#GreenerycnBody{
padding-top:10px;
clear:both;
letter-spacing:1px;/*字符间距 */
}
/*链接样式*/
#GreenerycnBody .link{
width:90%;
font-family:tahoma;
font-size:9pt;
line-height:100%;
text-transform:lowercase; /*小写显示 */
}
#GreenerycnBody a,#GreenerycnBody a:link,#GreenerycnBody a:active {
font-weight:bold;
text-decoration: none;
color: green;
}
#GreenerycnBody a:hover {
text-decoration: underline;
color: green;
}
/* 层样式 */
#GreenerycnBody div{
border:solid 1px #78A3D3;
background-color:#F5F8FC;
word-break:break-all;
overflow:auto;
padding:15px;
margin:15px 0;
}
/* 总标题 */
#GreenerycnBody h1{
font-size:23px;
padding:10px 0;
font-family:Verdana, Arial, Sans-Serif;
border-bottom:dashed 1px gray;
text-align:center;
background-color:#F5F8FC;
height:40px;
letter-spacing:0px;/*字符间距 */
}
/*发布日期 */
#GreenerycnBody .fooTime{
margin:0;
padding-top:5px;
text-align:center;
font-size:12px;
line-height:1em;
font-family:Verdana, Arial, Sans-Serif;
border:none;
}
/* 标题 */
#GreenerycnBody .title{
font-size:16px;
font-family:宋体;
TEXT-ALIGN: center;
font-weight:bold;
}
/* 段落 */
#GreenerycnBody p{
font-family: Verdana, Arial, Sans-Serif;
text-indent:2em;
line-height:100%;
font-size:11pt;
whiteSpace:normal;
letter-spacing:1px;/*字符间距 */
}
/* 一个蓝色的代码框 */
#GreenerycnBody .code {
font-family:"Verdana" , "Courier New", "Courier", "mono";
font-size: 12px;
line-height: 18px;
color: #000000;
background-color: #DDEDFB;
margin: 5px;
padding: 5px;
border: 1px solid green;
display:block;
}
#GreenerycnBody blockquote{
background-color:lightyellow;
border:1px dotted #dedbde;
padding:10px;
}
/* 脚注 */
#GreenerycnBody .foot{
height:43px;
padding:12px 0 0 0;
text-align:center;
margin:30px 0 0 0;
font-size:12px;
border:none;
border-top:dashed 1px gray;
}
</style>
我的文章框架:
<
div
id
="GreenerycnBody"
>
< h1 > 标题 </ h1 >
< p class ="fooTime" > 本文地址:
< script type ="text/javascript" >
document.write(document.URL)
</ script >
< p class ="fooTime" > 发布于
< script type ="text/javascript" > var path = document.URL;date = path.substring( 40 , 44 );month = path.substring( 45 , 47 );day = path.substring( 48 , 50 );document.write(date + ' 年 ' + month + ' 月 ' + day + ' 日 ' ); </ script >
</ p >
< div >
< p class ="link" >< a href ="http://blog.csdn.net/greenerycn" > Grenerycn's Blog </ a > </ p >
< p > 正文
</ p >
</ div >
< div class ="foot" > 本文地址: < script type ="text/javascript" >
document.write(document.URL)
</ script ></ div >
</ div >
< h1 > 标题 </ h1 >
< p class ="fooTime" > 本文地址:
< script type ="text/javascript" >
document.write(document.URL)
</ script >
< p class ="fooTime" > 发布于
< script type ="text/javascript" > var path = document.URL;date = path.substring( 40 , 44 );month = path.substring( 45 , 47 );day = path.substring( 48 , 50 );document.write(date + ' 年 ' + month + ' 月 ' + day + ' 日 ' ); </ script >
</ p >
< div >
< p class ="link" >< a href ="http://blog.csdn.net/greenerycn" > Grenerycn's Blog </ a > </ p >
< p > 正文
</ p >
</ div >
< div class ="foot" > 本文地址: < script type ="text/javascript" >
document.write(document.URL)
</ script ></ div >
</ div >
本文地址: <script type="text/javascript"> document.write(document.URL) </script>