Simple
 
   

 
网络日志
 

用户模板的美化
keso 发表于 2005-7-18 19:02:00

一、关于日历表格:

相信大家也注意到了,OBLOG的日历显示总是不尽如人意,很不漂亮,SNAKE一直以为这是OBLOG的网页文件的问题,只有系统管理员才能修改,但是看了leeways.7blog.net的BLOG和几个shineblog.com的BLOG的以后发现其实是有解决问题的方法的。

<style type="text/css">
<!--
#calendar{
    width:180px;    /* 日历的宽度为180px */
    margin-left:5px;    /* 左边距5px */
    border:1px solid #ECF4F6;    /* 边框宽1px 实线 颜色为#ECF4F6 */
}
caption{    /*定义日历顶部月份*/
    background-color:#ECF4F6;    /* 背景颜色为#ECF4F6 */
    line-height:20px;    /* 行高为 20px */
    font-weight:bold;    /* 粗体 */
    font-family:Georgia, "Times New Roman", Times, serif;   /* 字体 */
}
th{    /* 定义星期 */
    border-bottom:1px solid #ECF4F6;    /* 底边线 宽度1 px 实线 颜色为#ECF4F6 */
    background-color:#FCFDFE;    /* 背景颜色为#FCFDFE */
}
#calendar table {
   border-collapse: collapse; /*合并表格相临边框*/
}

/*  这个日历没有进行定义的内容包括: */

#calendar td{} /* 日历单元格样式 */

#calendar a{} /* 有日志的号数样式(链接样式) */

#calendar a:hover{} /* 鼠标经过日历有链接的号数的样式 */

-->

</style>

以上代码转载自http://www.shineblog.com/user1/718/archives/2005/69601.shtml
版权归http://www.shineblog.com所有。

二、关于分类导航:

大家如果查看自己的BLOG源代码的话就会发现,自己的分类导航是<li>控制的,也是这个层样式控制的<div id="subject">,那么是不是可以改变一下其呆板的样式呢?答案是可以的。

http://www.54player.com/tutorial/web/slidingdoors/slidingdoors.html文章的启发。

<style type="text/css">
<!--
#subject ul { /* 树向排列的分类导航ul属性设定 */
margin: 10px 0 0 0;
padding: 0;
list-style-type: none;
font: 12px "Trebuchet MS", Helvetica, Arial, sans-serif;
color: #F9EBDC;
}

#subject li { /* 树向排列的分类导航li属性设定 */
margin: 0 0 .2em 0;
width: 160px;
height: 22px;
white-space: nowrap;
}

#subject a { /* 树向排列的分类导航连接属性设定 */
display: block;
padding: 2px 2px 4px 24px;
width: 138px; height: 18px;
background: transparent url(/blog/images/subnav_normal.jpg) no-repeat 0 0;
}

#subject a:link {  /* 树向排列的分类导航连接文字属性设定 */
color: #FFF;
text-decoration: none;
}
#subject a:visited { /* 树向排列的分类导航连接文字访问后属性设定 */
color: #EB7153;
text-decoration: none;
}
#subject a:hover { /* 树向排列的分类导航连接文字鼠标响应属性设定 */
background: transparent url(/blog/images/subnav_over.jpg) no-repeat 0 0;
color: #FFF;
}
-->

</style>

横向的分类将#subject改为#subject_l,另外其他的列表也可以美化,比如“最新日志”的ID属性就是#newblogs,最新回复的ID的属性是#newcomments,等等。(不知道的请查看自己BLog的代码)。

阅读全文 | 回复(0) | 引用通告 | 编辑

发表评论:

    昵称:
    密码:
    主页:
    标题:




 
公  告
 

 
站点日历
 

 
最新日志
 

 
最新评论
 

 
最新留言
 

 
日志搜索
 

 
用户登陆
 

 
统计信息
 


 
友情连接
 

Powered by Oblog.