百度空间 | 百度首页 
               
 
查看文章
  
【原】分享模板，分享快乐
2006/11/19 00:03 A.M.

卷首语：日记本模板维护中止于2007.1.1，更多精彩模板请关注以下链接。

 

相关文章：【原】旧报纸模板
　　　　　【原】百度空间CSS终极技巧
　　　　　【原】博客流量统计
　　　　　【原】博客播放在线广播
　　　　　【转】CSS手册简编

 

　　百度模板大赛就要接近尾声，虽然距离第一名还很遥远，但能有今天的成绩，我已经非常欣慰。衷心的感谢所有支持我的朋友。

　　感谢的同时，我也要向使用我的“日记本”模板的朋友说声对不起。不停的有朋友来问“为什么使用了我的模板就不能进入二级菜单了”。这并非我的本意，只是当时没掌握诀窍。已经中招的朋友可以去模版分享随便换个模版即可。如果仍想使用本模版，请复制文末的修正版代码。下面就讲讲这个模板的成长经历吧。

日记本（点击预览）


　　1. 给人温馨感觉的日记本

　　模板是张扬个性的方式，而我却不喜欢过于张扬的模板。我的博克是心灵的归宿，是存放记忆的盒子，是与朋友交流的小屋。所以我要把它设计的尽量自然和温馨。笔记本的创意源于一个外文站点，但它还远不是我想要的。于是我到处寻找素材，日记本的框架，放大象的插画、页面上的中国古典背景和图章样式的标题图等等，所有的图都经过精心的打磨。

　　2. 有了砖瓦，房子还远么

　　用素材搭建页面是个技术活，所需的不仅是模块间的无缝拼接，更是一种审美观的展现。为了把页面做得更完美，常常要反过头重新处理素材。这样，页面主体在一夜间就成型了，但是菜单栏的位置却成了一个难题。

　　3. 菜单栏 = 书签

　　菜单栏按照原来的横向样式，摆在哪里都不自然。查遍CSS手册，终于利用“writing-mode:tb-rl”将菜单竖了起来，又费了很大劲才把菜单栏的背景及悬停样式搞定。这样，一个带有书签的笔记本就大致完工了。但同时，二级菜单栏却莫名其妙的丢失了。还好我可以利用网页的方式来访问模板编辑等选项。这里，我要感谢hibaidu.cn作了一个快捷的工具栏，模板出现故障的朋友可以利用http://hibaidu.cn/tool/来恢复页面。

　　4. 页面的尺寸

　　因为我的显示器是17寸和19寸的液晶，所以一开始就把页面设计成1280px*1024px的尺寸。想想现在液晶这么便宜，应该大部分朋友都脱贫了吧。但是不停的有朋友来建议我做成1024*768的尺寸。本来觉得无所谓，直到有一次去网吧上网，才猛然发现还有那么多的同志忍受着17寸CRT的煎熬，而且还有很多人用本本上网。于是我下定决心把页面重新写了一遍，累啊~

　　5. 小细节

　　房子盖起来不容易，点缀更要下功夫。本来很反感在主页添加背景音乐，渐渐的我也接受了这种做法。至少，柔美的音乐会为博客平添一分意境。可惜原先的播放器只会破坏页面的整体美观。经过长时间的试验，终于找到了一些漂亮的flash播放器。这里，有一点点技巧，首先要用margin把播放器多余的地方屏蔽；其次，可用filter:chroma滤镜将播放器里的杂色设置成透明色。filter:chroma滤镜还可用于处理显示日期和天气的图片，效果很赞（今天http://www.eyezone.cn/好像出了故障，希望它能快点恢复）！这样的小细节还有很多，比如说border，它其实有很多种漂亮的特效，用它来画分割线真是大材小用了。

　　6. margin和padding

　　初学者很难搞清它俩的区别，事实上它俩的效果也差不多。可是要实现精确布局，就必须掌握它俩的用法。在这个问题上，我走了不少弯路，很多奇怪的故障，最后查明就是因为混淆了margin和padding造成的。

　　7. 继承关系

　　老实说，我到现在也没有彻底弄清模块间的继承关系，以至于写了很多废代码。如果你想成为一个真正的高手，就必须摸清这套关系。

　　8. 二级菜单

　　今天，终于搞定了那个不安分的二级菜单！原来这是百度空间固有的布局，即二级菜单默认将header和stage分割开且处于他们的底层，你根本不能调整它的位置。我也是在一次偶然的刷新中瞄到它一闪而过，而后就被下面的stage盖住了。于是我用margin把它拖了上来，然后用background给他补了块背景。

　　至此本模板彻底完工！

　　9. 美中不足

　　生活中有些事是你自己驾驭不了的，百度模板也如此。例如：评论框的宽度、文章内的背景音乐、相册中缩略图的尺寸、相册预览下面的按钮、头像图片的尺寸、文章摘要的长度、main模块的位置、创建新文章模块的调整、页数模块的调整、等等等等。这世界上没有完美的东西，所以我们才会乐此不疲的让明天更美好~

　　10. 分享并快乐着

　　分享你的快乐，会使快乐翻倍；分享你的忧愁，会使忧愁减半。这么简单的道理，却有很多朋友不懂。于是，有人担心模板被人挪用，有人抱怨创意被人抄袭，更有甚者竟在首页祭起了三字经。如此，只是自取其扰。

　　在此声明，喜欢我模板的朋友，就请随便的用吧，大胆的改吧。如果对模板设计有什么疑问，可以在此交流。至于加不加友情链接，那是您的自由。下面附上日记本（分享版）的CSS源码。 

 

 

 

/********* Welcome to read my css file, just enjoy it. *********/ 
/****************** http://hi.baidu.com/ganq ******************/ 

/******整个空间页面******/ 
body{background:url(http://hiphotos.baidu.com/ganq/pic/item/c60bfb1fe9395df5e0fe0b92.jpg) top left;CURSOR:url(http://webme.bokee.com/inc/mouse022.ani);overflow-x:hidden;}/*页面背景及鼠标样式*/ 
a:link{CURSOR:url(http://webme.bokee.com/inc/mouse022.ani);} /*链接鼠标样式*/ 
a:visited{CURSOR:url(http://webme.bokee.com/inc/mouse022.ani)} /*访问鼠标样式*/ 
a:hover{CURSOR:url(http://webme.bokee.com/inc/mouse022.ani)} /*悬停鼠标样式*/ 

/******空间顶部******/ 
#userbar{} /*登陆栏，不可更改*/ 

/******空间主体******/ 
#main{background:url(http://hiphotos.baidu.com/ganq/pic/item/8f215ada0e42cedbb7fd480b.jpg) no-repeat bottom;} /*底部背景，比header与stage略宽*/ 

/******空间头部******/ 
#header{height:259px;width:20px;} /*头部背景*/ 
#header div.lc{width:1000px;height:259px;background:url(http://hiphotos.baidu.com/ganq/pic/item/b91d114c0fcb45f9d62afcce.jpg) top left no-repeat;} /*头部左侧背景*/ 
#header div.rc{background:url(http://hiphotos.baidu.com/ganq/pic/item/071eb9fbaf8a95224e4aeae7.jpg) 95% 30% no-repeat;} /*头部右侧背景*/ 
#header div.tit{width:200px;top:90px;left:120px;line-height:22px;font-size:12px;font-family:宋体 楷体_GB2312;filter:glow(color=#E76108,strength=3);} /*空间名称位置及字体*/ 
#header div.tit a.titlink{color:#FFFFFF;text-decoration:none;} /*空间名称链接字体*/ 
#header div.tit a.titlink:visited{color:#FFFFFF;} /*访问效果*/ 
#header div.desc{width:300px;top:110px;left:120px;color:#FFFFFF;font-size:12px;filter:glow(color=#E76108,strength=3);} /*空间描述位置及字体*/ 

/******一级导航菜单******/ 
#tab{top:80px;left:24px;} /*一级菜单背景*/ 
#tab a,#tab a:link,#tab a:visited{color:#666666;font-size:12px;font-family:宋体;text-decoration:none;writing-mode:tb-rl;text-align:center;text-indent:-3px;background:url(http://hiphotos.baidu.com/ganq/pic/item/83e5b1a11bdeee8b461064d1.jpg) top left no-repeat;height:90px;} /*菜单未选中状态*/ 
#tab a:hover{color:#000000;text-decoration:none;background:url(http://hiphotos.baidu.com/ganq/pic/item/aa39da006f6e5111738b65d1.jpg) top left no-repeat;} /*菜单悬停状态*/ 
#tab a.on,#tab a.on:link,#tab a.on:visited,#tab a.on:hover{color:#000000;text-decoration:none;font-weight:bold;background:url(http://hiphotos.baidu.com/ganq/pic/item/cdd8f3dc05cf26a1cc1166d1.jpg) top left no-repeat;} /*菜单选中状态*/ 
#tab span{color:#FFFFFF;font-size:12px;display:none;} /*菜单间的分割符|*/ 
#tabline{margin:0px 0px 0px 0px;} /*菜单下方分割线*/ 
/*#tab{filter:alpha(opacity=20);-moz-opacity:0.8;} 菜单透明化处理*/ 

/******二级导航菜单******/ 
#tab2{width:1000px;background:url(http://hiphotos.baidu.com/ganq/pic/item/ffaeda138c3f1e025baf53d1.jpg) 0% 100%;} /*二级菜单背景*/ 
#tab2 span{color:#000000;font-size:12px;font-weight:bold;} /*菜单间的分割符*/ 
#tab2 a{color:#333333;font-size:12px;} /*未选中效果*/ 
#tab2 a:link{color:#333333;text-decoration:none;} /*链接效果*/ 
#tab2 a:visited{color:#333333;text-decoration:none;} /*访问效果*/ 
#tab2 a:hover{color:#000000;text-decoration:underline;} /*悬停效果*/ 

/******内容区域******/ 
.stage{margin-bottom:60px;background:url(http://hiphotos.baidu.com/ganq/pic/item/ffaeda138c3f1e025baf53d1.jpg) top left repeat-y;} /*内容区域背景*/ 
.stagepad{width:925px;margin:15px 0px 10px 75px;background:url(http://escati.linkopp.net/clock/clock.php?prgb=666666&timezone=GMT+0800) no-repeat 770px 20px;} /*内部页面，可用来显示时钟*/ 
#mod_bloglist .modtit{} /*文章列表标题*/ 
#mod_profile .modtit{} /*个人档案标题*/ 
.mod#mod_bloglist{} /*文章列表模块*/ 
#layout td.c2t1,#layout td.c2t3{} /*内容区域横向划分为两版*/ 
#layout td.c2t1{width:800px;padding:0px 115px 0px 85px;} /*第一版尺寸*/ 
#layout td.c2t3{width:200px;padding-right:20px;} /*第二版尺寸*/ 

/******其它区域******/ 
#comm_info{} /*其它区域背景*/ 
#m_comm_info{margin-left:5px;padding-left:20px;font-size:12px;color:#666666;background:url(http://hiphotos.baidu.com/ganq/pic/item/c9b544c26836f335e4dd3b5e.jpg) no-repeat 0px 11px} /*其它模块*/ 
#pvshow{font-size:12px;font-family:Georgia;color:#555555;visibility:visible;} /*访问量数字字体*/ 
#comm_info.mod{height:260px;background:url(http://firetear.com/weather/weather.aspx) no-repeat 20px 70px;filter:chroma(color=#FFFFFF)chroma(color=#b9b9b9);} /*可用来显示日历天气等*/ 
#comm_info a{color:#777777;font-size:12px;text-decoration:none;} /*RSS订阅链接*/ 
#comm_info a:hover{color:#000000;font-size:12px;text-decoration:underline;} /*悬停效果*/ 
#comm_info div a{visibility:hidden;} /*是否显示百度logo*/ 
#comm_info div.line{margin-left:-20px;margin-top:5px;line-height:8px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*分界线*/ 

/******页码区域，位置及颜色编辑无效******/ 
#page{height:30px;font-size:12px;font-weight:bold;text-align:center;color:#333333;} /*页码区域背景*/ 
#page span{color:#333333;font-size:12px;font-weight:bold;} 
#page a{padding:1px;color:#666666;font-size:12px;font-weight:;text-decoration:none;} /*页码*/ 
#page a:visited{color:#666666;text-decoration:none;} 
#page a:hover{color:#000000;text-decoration:underline;} 

/******模块区域：内容区域的所有模块的公用设置******/ 
.mod{padding:5px 0px 5px 0px;} /*模块区域背景及模块间距*/ 
.modhandle{cursor:move;} /*?*/ 
.modth{} /*模块标题栏背景*/ 
.modhead{padding:4px 0px 0px 4px;} 
.modopt{padding:4px 4px 0px 0px;} /*模块操作区，如写新文章*/ 
.modtit{font-size:12px;font-weight:bold;font-family:宋体;color:#333333;} /*模块标题区*/ 
a.modtit{color:#333333;} 
a.modtit:visited{color:#333333;} 
.modtitlink{color:#333333;font-size:12px;font-weight:bold}a.modtitlink{color:#333333;text-decoration:none}a.modtitlink:visited{color:#333333;text-decoration:none}a.modtitlink:hover{color:#000000;text-decoration:underline;} 
.modact{color:#444444;font-size:12px;}a.modact:link{color:#AAAAAA;text-decoration:none;}a.modact:visited{color:#AAAAAA;text-decoration:none;}a.modact:hover{color:#000000;text-decoration:underline;} /*操作文字链接，如文章列表*/ 
.modbox{padding:10px 0px 0px 5px;} /*模块内容区，包括文章标题和内容*/ 
.modtl{width:18px;background:url(http://hiphotos.baidu.com/ganq/pic/item/c36aabec607c243d27979108.jpg) no-repeat left;} /*模块左上角背景*/ 
.modtc{} /*模块中上背景*/ 
.modtr{} /*模块右上角背景*/ 
.modbl{} /*模块左下角背景*/ 
.modbc{} /*模块中下背景*/ 
.modbr{} /*模块右下角背景*/ 

/******文章区域******/ 
#m_blog{width:590px;} /*文章区域背景*/ 
#m_blog div{} 
#m_blog div.tit{text-indent:20px;font-size:14px;font-weight:bold;background:url(http://hiphotos.baidu.com/ganq/pic/item/e1fce0c4822d36a98326ac2a.jpg) no-repeat;height:20px;} /*文章标题背景*/ 
#m_blog div.tit a{color:#22222;font-size:14px;font-weight:bold;text-decoration:none;} /*文章标题链接*/ 
#m_blog div.tit a:link{color:#222222;text-decoration:none;} /*链接效果*/ 
#m_blog div.tit a:visited{color:#222222;text-decoration:none;} /*访问效果*/ 
#m_blog div.tit a:hover{color:#000000;text-decoration:underline;} /*悬停效果*/ 
#m_blog div.date{margin:-20px 0px 0px 20px;font-size:10px;color:#AAAAAA;text-align:right;} /*文章发表日期*/ 
#m_blog div.cnt{margin:20px 0px 0px 10px;color:#222222;font-size:13px;line-height:2;} /*文章内容*/ 
#m_blog div.cnt p{line-height:160%;} /*文章内容段落*/ 
#m_blog div.more{display:none;margin:10px 0px 12px 20px;color:#222222;} /*阅读全文链接*/ 
#m_blog div.more a{color:#000000;font-size:12px;} 
#m_blog div.opt{text-indent:20px;font-size:12px;font-weight:bold;background:url(http://hiphotos.baidu.com/ganq/pic/item/aee69945d3daa23f86947353.jpg) no-repeat left center;color:#333333;margin-top:18px;} /*文章操作区背景*/ 
#m_blog div.opt a{color:#333333;font-size:12px;font-weight:bold;text-decoration:none;} /*文章操作区内容*/ 
#m_blog div.opt a:hover{color:#000000;text-decoration:underline;font-weight:bold;} /*悬停效果*/ 
#m_blog div.line{margin-top:17px;line-height:2;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*文章分界线背景*/ 
#m_blog div.none{padding:100px 0 100px 0;color:#333333;font-size:14px;} /*无文章提示信息*/ 

/******个人档案区域******/ 
#m_pro{width:570px;} /*个人档案区域背景*/ 
#m_pro a{color:#333333;font-size:12px;text-decoration:none;} /*查看详细信息链接*/ 
#m_pro a:visited{color:#333333;} 
#m_pro a:hover{color:#000000;text-decoration:underline;} /*悬停效果*/ 
#m_pro div.image{width:120px;height:120px;text-align:left;filter:shadow(color=#888888,direction=120);} /*个人头像*/ 
#m_pro div.act{margin-top:10px;color:#333333;font-size:12px;} /*操作区背景，如加为好友、发送消息*/ 
#m_pro div.act a:visited{color:#333333;} 
#m_pro div.act a:hover{color:#000000;text-decoration:underline;} /*悬停效果*/ 
#m_pro div.user{margin-top:10px;color:#333333;font-size:12px;font-weight:bold;font-family:arial;} /*用户名*/ 
#m_pro div.desc{width:150px;margin-top:5px;line-height:21px;color:#333333;font-size:12px;} /*用户简介*/ 
#m_pro div.line{width:160px;margin-top:20px;line-height:8px;} /*分界线*/ 
#m_pro td{color:#333333;font-size:12px;} /*?*/ 

/******相册区域******/ 
#m_album{} /*相册区域背景*/ 
#m_album a{color:#666666;font-size:12px;text-decoration:none;} 
#m_album a:visited{color:#666666;} /*文字链接效果*/ 
#m_album a:hover{color:#000000;text-decoration:underline;} /*文字悬停效果*/ 
#m_album div.image{height:220px;} /*相册预览区域*/ 
#m_album a img{width:160px;margin-left:5px;border:3px ridge #888888;filter:alpha(opacity=80);} /*图片链接*/ 
#m_album a:hover img{filter:alpha(enabled=0);} /*图片悬停效果*/ 
#cbut{margin-left:5px;} /*相册操作按钮*/ 
#cbut a img{width:auto;height:auto;margin-left:0px;border:0px;filter:alpha(enabled=0);} /*按钮图片*/ 

/******最近访客******/ 
#m_track{} /*最近访客*/ 
#m_track a{color:#666666;font-size:10px;line-height:25px;text-decoration:none;word-wrap:normal;}/*文字链接*/ 
#m_track a:hover{color:#000000;text-decoration:none;} /*文字悬停效果*/ 
#m_track a img{width:55px;height:55px;border:2px dotted #333333;filter:gray(enabled=1);}/*头像图片链接*/ 
#m_track a:hover img{border:2px solid #333333;filter:gray(enabled=0);} /*图片悬停效果*/ 

/******百度搜索******/ 
#m_search{} 
#m_search div{width:200px;margin-left:-7px;} /*百度搜索区域*/ 
#m_search input.text{margin:5px 0px 5px 0px;} /*输入框*/ 
#m_search label{} /*选框区域*/ 
#m_search input.radio{background:none;border:0px;} /*选框前的圆圈*/ 
#m_search input.submit{margin-top:8px;} /*提交按钮*/ 

/******文章分类区域******/ 
#m_artclg{} /*文章分类区域背景*/ 
#m_artclg div.item{padding-left:20px;font-size:12px;color:#999999;background:url(http://hiphotos.baidu.com/ganq/pic/item/c9b544c26836f335e4dd3b5e.jpg) no-repeat 0px 1px;} /*文章分类区域子项*/ 
#m_artclg div.item a{margin-right:6px;color:#333333;font-size:12px;text-decoration:none;} /*文章分类名称*/ 
#m_artclg div.item a:hover{color:#000000;text-decoration:underline;position:relative;left:1px;top:1px;clip:rect();} /*悬停效果*/ 
#m_artclg div.line{margin-top:5px;line-height:8px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*分界线*/ 

/******文章存档区域******/ 
#m_filed{} /*文章存档区域背景*/ 
#m_filed div.item{padding-left:20px;font-size:12px;color:#999999;background:url(http://hiphotos.baidu.com/ganq/pic/item/c9b544c26836f335e4dd3b5e.jpg) no-repeat 0px 1px;} /*文章存档区域子项*/ 
#m_filed div.item a{margin-right:6px;color:#333333;font-size:12px;text-decoration:none;} /*文章存档名称*/ 
#m_filed div.item a:hover{color:#000000;text-decoration:underline;position:relative;left:1px;top:1px;clip:rect();} /*悬停效果*/ 
#m_filed div.line{margin-top:5px;line-height:8px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*分界线*/ 

/******最新评论区域******/ 
#m_comment{} /*最新评论区域背景*/ 
#cmtArea{padding-left:20px;background:url(http://hiphotos.baidu.com/ganq/pic/item/c9b544c26836f335e4dd3b5e.jpg) no-repeat 0px 1px} 
#m_comment div.item{} /*最新评论区域子项*/ 
#m_comment div.item a{color:#333333;font-size:12px;text-decoration:none;} /*最新评论标题*/ 
#m_comment div.item a:hover{color:#000000;text-decoration:underline;position:relative;left:1px;top:1px;clip:rect();} /*悬停效果*/ 
#m_comment div.item a.cnt{padding-left:20px;color:#777777;font-size:12px;text-decoration:none;} /*评论摘要*/ 
#m_comment div.item a.cnt:hover{text-indent:30px;color:#000000;text-decoration:none;font-weight:normal;position:relative;left:0px;top:0px;clip:rect();} /*悬停效果*/ 
#m_comment div.line{margin-top:5px;line-height:8px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*分界线*/ 

/******友情链接区域******/ 
#m_links{} /*友情链接区域背景*/ 
#m_links div.item{padding-left:20px;text-indent:-18px;background:url(http://hiphotos.baidu.com/ganq/pic/item/c9b544c26836f335e4dd3b5e.jpg) no-repeat 0px 1px;} /*区域子项背景*/ 
#m_links div.item a{color:#333333;font-size:12px;text-decoration:none;}/*区域子项链接*/ 
#m_links div.item a:hover{color:#000000;text-decoration:underline;position:relative;left:1px;top:1px;clip:rect();} /*悬停效果*/ 
#m_links div.item{color:#777777;} /*链接简介*/ 
#m_links div.line{margin-top:5px;line-height:8px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*分界线*/ 

/******自定义模块1******/ 
#m_mylink1{} /*自定义模块1区域背景*/ 
#m_mylink1 div.item{padding-left:20px;background:url(http://hiphotos.baidu.com/ganq/pic/item/c9b544c26836f335e4dd3b5e.jpg) no-repeat 0px 1px;} /*区域子项背景*/ 
#m_mylink1 div.item a{color:#333333;font-size:12px;text-decoration:none;}/*区域子项链接*/ 
#m_mylink1 div.item a:hover{color:#000000;text-decoration:underline;position:relative;left:1px;top:1px;clip:rect();} /*悬停效果*/ 
#m_mylink1 div.line{margin-top:5px;line-height:8px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*分界线*/ 

/******自定义模块2******/ 
#m_mylink2{} /*自定义模块2区域背景*/ 
#m_mylink2 div.item{padding-left:20px;background:url(http://hiphotos.baidu.com/ganq/pic/item/c9b544c26836f335e4dd3b5e.jpg) no-repeat 0px 1px;} /*区域子项背景*/ 
#m_mylink2 div.item a{color:#333333;font-size:12px;text-decoration:none;}/*区域子项链接*/ 
#m_mylink2 div.item a:hover{color:#000000;text-decoration:underline;position:relative;left:1px;top:1px;clip:rect();} /*悬停效果*/ 
#m_mylink2 div.line{margin-top:5px;line-height:8px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*分界线*/ 

/******相册第一层******/ 
#m_albumlist{width:590px;padding-top:10px;} /*相册区域背景*/ 
#m_albumlist div.note{color:#333333;font-size:12px;} 
#m_albumlist div.desc{padding:5px 10px 10px 20px;line-height:22px;font-size:12px;} /*相册简介*/ 
#m_albumlist div.none{} /*无照片提示信息*/ 
#m_albumlist a img{width:105px;border:1px solid #999999;filter:alpha(opacity=80);} /*小相册的封面图*/ 
#m_albumlist a:hover img{border:1px solid #333333;filter:alpha(enabled=0);} /*悬停效果*/ 
#m_albumlist div.line{width:575px;margin:10px 0px 10px 0px;line-height:16px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*分界线*/ 
#m_albumlist div.tit{margin:6px 0px 7px 0px;color:#333333;font-size:12px;} /*相册标题*/ 
#m_albumlist div.tit a{color:#333333;font-size:12px;text-decoration:none;} 
#m_albumlist div.tit a:hover{color:#000000;text-decoration:underline;position:relative;left:1px;top:1px;clip:rect();} /*悬停效果*/ 
#m_albumlist span.count{color:#333333;font-size:12px;font-weight:bold;} /*照片数量*/ 

/*相册第二层*/ 
#m_albumlist span.size{color:#666666;font-size:12px;font-family:Arial;} /*照片尺寸*/ 
#m_albumlist a.act{color:#AAAAAA;font-size:12px;text-decoration:none;} /*操作区链接，如编辑、删除*/ 
#m_albumlist a.act:hover{color:#000000;text-decoration:underline;} /*悬停效果*/ 
#m_albumlist #page {width:600px;color:#333333;font-size:12px;font-weight:bold;} /*当前页码*/ 
#m_albumlist #page a{color:#666666;font-size:12px;font-weight:bold;text-decoration:none;} /*其他页码*/ 
#m_albumlist #page a:hover{color:#000000;text-decoration:underline;} /*悬停效果*/ 

/*相册第三层*/ 
#imagee a img{width:590px;} /*图片区域*/ 
#m_albumlist div.phimg a img{width:500px;margin:5px 0px 10px 10px;filter:alpha(enabled=0);} /*图片*/ 
#m_albumlist div.phimg a:hover img{filter:alpha(enabled=0);} /*图片*/ 
#m_albumlist div.phinfo{margin:0px 0px 0px 10px;color:#666666;} /*图片信息*/ 
#m_albumlist div.phpage{margin:0px 0px 5px 10px;} /*操作按钮的区域*/ 
#m_albumlist div.phpage a img{width:auto;border:0px;} /*操作按钮*/ 
#m_albumlist div.phpage a:hover img{border:0px;} /*操作按钮悬停样式*/ 

/******好友列表******/ 
#m_friend{width:590px;} /*好友列表区域背景*/ 
#m_friend div.filter{margin-bottom:10px;padding-left:10px;padding-top:10px;height:27px;line-height:27px;} 
#m_friend div.catalog{margin-bottom:10px;padding-left:10px;height:27px;line-height:27px;background-color:#F2F2F2;font-size:12px;} 
#m_friend a img{width:80px;height:80px;border:2px dotted #333333;filter:gray(enabled=1);} /*好友头像*/ 
#m_friend a:hover img{border:2px solid #333333;filter:gray(enabled=0);} /*悬停效果*/ 
#m_friend div.user a img{width:auto;height:auto;border:0px;filter:gray(enabled=0);} /*操作按钮图片*/ 
#m_friend div.user{margin-top:4px;color:#666666;font-size:12px;} /*好友名称*/ 
#m_friend div.user a{color:#666666;font-size:12px;text-decoration:none;word-wrap:normal;} /*好友名称链接*/ 
#m_friend div.user a:hover{color:#000000;text-decoration:underline;} /*悬停效果*/ 
#m_friend div.line{margin-top:10px;line-height:15px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*分界线*/ 

/******设置访问统计、模板设置******/ 
#m_setting{width:590px;} /*设置区域背景*/ 
#m_setting a{color:#333333;text-decoration:none;} /*设置区域链接*/ 
#m_setting a:hover{color:#000000;text-decoration:underline;} /*悬停效果*/ 
#m_setting{line-height:22px;color:#333333;font-size:12px;} /*设置区域主体*/ 
#m_setting img.sel{} /*模板预览图，选中状态*/ 
#m_setting img.unsel{width:150px;border:1px solid #D2D2D2;} /*模板预览图，未选中状态*/ 
#m_setting span.tit{font-size:12px;} /*模板标题名称*/ 
#m_setting span.usr{color:#333333;} /*作者名*/ 
#m_setting div.sel{padding-top:6px;font-size:12px;font-weight:bold;} /*“当前模板”文字*/ 
#m_setting div.line{margin-top:20px;line-height:15px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*分界线*/ 

/******系统公告******/ 
#m_sysinfo{padding-left:10px;} 
#m_sysinfo a{color:#333333;text-decoration:none;} 
#m_sysinfo a:hover{color:#000000;text-decoration:underline;} 
#m_sysinfo{line-height:22px;color:#333333;font-size:12px;} 
#m_sysinfo span.new{color:#333333;font-size:10px;font-family:Arial;} 
#m_sysinfo span.date{color:#333333;font-size:12px;} 

/******基本选项******/ 
#m_setbase{color:#333333;font-size:12px;} 
#m_setbase div.item{} 
#spSpaceName{} /*空间名称*/ 
#spSpaceDescri{} /*空间简介*/ 
#spConfigDispNum{} /*每页显示文章*/ 
#spConfigDispMod{} /*文章显示*/ 
#spDateMod{} /*时间格式*/ 
#btn_submit{} /*保存选项按钮*/ 
#m_setbase div.line{margin-top:5px;line-height:8px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} 

/******内部网友评论区域******/ 
#in_comment{width:585px;} /*网友评论区域背景*/ 
#in_comment div{} 
#in_comment div.tit{margin-bottom:12px;color:#333333;font-size:14px;font-weight:bold;} /*网友评论标题*/ 
#in_comment div.user{margin:0px 20px 0px 20px;color:#333333;font-size:12px;} /*评论发表人名*/ 
#in_comment div.user a{color:#333333;font-size:12px;text-decoration:none;} /*评论发表人名链接*/ 
#in_comment div.user a:hover{color:#000000;text-decoration:underline;} /*悬停效果*/ 
#in_comment div.user span.date{color:#AAAAAA;font-size:10px;} /*评论发表时间*/ 
#in_comment div.desc{margin:5px 20px 0px 20px;color:#333333;font-size:12px;text-indent:2em;} /*评论内容*/ 
#in_comment div.line{margin-top:15px;line-height:15px;background:url(http://img.baidu.com/hi/temp20/dot.gif) repeat-x;} /*分界线*/ 

/******内部发表评论区域******/ 
#in_send{} /*发表评论区域背景*/ 
#in_send div.tit{margin-bottom:10px;color:#333333;font-size:14px;font-weight:bold;} /*发表评论标题*/ 
#in_send table{margin-left:15px;} /*发表评论内容*/ 
#in_send input.spBlogCmtor,input.spBlogCmtURL,textarea.spBlogCmtText{font-size:12px;} /*发表评论子项*/ 
#in_send td.f14{font-size:12px;} /*提示语*/ 
#spBlogCmtor{} /*姓名输入框*/ 
#spBlogCmtURL{} /*网址输入框*/ 
#spBlogCmtText{width:470px!important;} /*评论输入框*/ 

/******表单按钮样式定义******/ 
input, select, textarea{border:1px #AAAAAA solid;font-size:12px;} 
input{height:20px;background:url(http://hiphotos.baidu.com/ganq/pic/item/11f3662226f75da44723e8c7.jpg) top left repeat-x;} 
form{} /*单行文本框与按钮*/ 
select{} /*下拉选框*/ 
textarea{background:url(http://hiphotos.baidu.com/ganq/pic/item/c60bfb1fe9395df5e0fe0b92.jpg);} /*多行文本框背景*/ 

/******播放器样式******/ 
#mod_bgmusic{text-indent:200px;margin:-10px 0px 15px -200px;background:url(http://hiphotos.baidu.com/ganq/pic/item/d5e4aa8be909737e9f2fb4a2.jpg) no-repeat 200px 0px;} /*此处可用背景屏蔽播放器*/ 
#phx{filter:alpha(opacity=0);width:180px;height:34px;margin:115px 10px 0px 0px;} /*设置播放器颜色及透明度*/ 

/******空间底部******/ 
#ft{} /*baidu版权信息，不可更改*/ 

/****** Copyright © 2006 GanQ. All right reserved. ******/ 

 

 p.s.  尊重知识产权，请勿修改版权信息。  


类别：写写擦擦 | 添加到搜藏 | 浏览() | 评论 (71)
 
最近读者：
 
网友评论：
1
2006/11/19 08:35 A.M. | 回复
感谢光临我的个人空间。 呵呵，实际上点击率嘛，只是一种形式而已。 加你好友了。
 
2
2006/11/19 09:04 A.M. | 回复
呵呵，想看我照片？！好吧，我就帖一张出来，不好看不许骂我！！！ 记得去我的空间看
 
3
2006/11/19 11:04 A.M. | 回复
hehe,谢谢支持啊！
 
4
2006/11/19 12:40 P.M. | 回复
兔牙来了 假公主也来了 我就是兔牙公主 呵呵 很PP的空间 真的很大气的感觉啊 哈哈 加你为好友了 免去验证码哦 画大象 画兔子 画画....................
 
5
2006/11/19 12:53 P.M. | 回复
看得出兄弟对css的研究下了很大的功夫，这款模板也凝聚了很多心血，再次感谢兄弟的无私分享~
 
6
2006/11/19 01:53 P.M. | 回复
啊啊啊啊 我忘了，把头像换掉了 你快看啊 看完了我再换回来
 
7
2006/11/19 03:32 P.M. | 回复
没我想像的成熟阿
 
8
2006/11/19 03:49 P.M. | 回复
似乎个人头像那里。。。 只有你设置的那副图片。。 这样。。 不会很不协调吗。。。 虽然那个图还可以动。 看起来蛮强的。。 可是我有自己的图像啊。。
 
9
2006/11/19 03:54 P.M. | 回复
用上面那段代码，就有自己的头像了~
 
10
2006/11/19 04:09 P.M. | 回复
大哥。。 怎么我的更多文章下面的播放器部分。。。 是黑色一块····
 
11
2006/11/19 04:10 P.M. | 回复
向大象同志敬业的作风表示最崇高的敬意!!!
 
12
2006/11/19 04:14 P.M. | 回复
你能看到我的播放器么？如果看不到说明你的播放器不支持flash；如果能看到，你在设置音乐时要按照如下地址编写： http://www.estvideo.com/dew/media/dewplayer.swf?son=歌曲的网络链接
 
13
2006/11/19 04:14 P.M. | 回复
我的本本就是用1024*768的,前段时间来你这都要忍受下面的滚动条,现在看起来舒服多了,哈哈~~ 好象目前还是用1024*768的人多,有次去网吧还发现有800*600的呢
 
14
2006/11/19 04:56 P.M. | 回复
你好啊大象，欢迎你去看看我做的模板，虽然很简单但是请多提宝贵意见啊～ 我是vivian~
 
15
2006/11/19 04:57 P.M. | 回复
对了，忘了告诉你是在连接那里的文小猫~
 
16
2006/11/19 09:33 P.M. | 回复
谢谢你的分享，一直都很羡慕你能做出这么有难度的模板
 
17
2006/11/19 10:15 P.M. | 回复
PPMM不是应该去北影找吗，为什么去人大啊？ 不过我有个小姑姑在人大，确实很漂亮
 
18
2006/11/20 08:06 A.M. | 回复
哈哈..谢谢哦 但是你给我的那个我还是不会玩 算咯
 
19
2006/11/20 02:31 P.M. | 回复
HEHE ~~~ shi ya YOU XI SHAO WAN jay俱乐部欢迎您的来访~~~ 帮我参考一下`~ 谢谢~~~~ 我是戒烟`~~ 呵呵`~~ 闪了呦`~~~~~`~~ 别忘了帮我参考一下`~~~
 
20
2006/11/20 04:43 P.M. | 回复
模板做的很好 值得学习
 
21
2006/11/20 06:39 P.M. | 回复
大象的模板确是精品,难得一见,一定是花了不少的心血.
 
22
2006/11/22 06:33 A.M. | 回复
此模版实属经典模版。应该上榜。并且拿奖。真的。
 
23
2006/11/22 08:02 A.M. | 回复
你的这个可谓是经典啊！
 
24
2006/11/22 09:08 A.M. | 回复
呵呵··大象的這個確實不錯··還有啊··你那個設置 top距離竟然是負的···害我也跟者中計~~呵呵··不過還是搞回來了
 
25
2006/11/22 11:04 A.M. | 回复
谢谢楼上的指正，那是一段废代码，也是当时为了调整tab的一个试验。 现在已经更正了，不过我估计这里边还有很多废代码~~~
 
26
2006/11/22 02:03 P.M. | 回复
好漂亮的日记本啊.你的导航条居然可以竖过来哦.
 
27
2006/11/22 03:32 P.M. | 回复
个人觉得大象日记本的设计最好,简单明快又有创意.其他的都象大花脸,要不又太简单.
 
29
2006/11/22 07:46 P.M. | 回复
楼上果酱了~ 还有很多出色的模版，可能因为分享的较晚，没被顶上来。
 
30
2006/11/22 08:15 P.M. | 回复
你的板子很不错，就是推出的晚了点。我也是刚推出的，真的是不弄不知道有多么辛苦啊，呵呵~~
 
31
2006/11/22 09:46 P.M. | 回复
偶然发现你的这个模板,不夸张的说,是我见到最有个性,也最漂亮的,虽然我不懂这些制作方面的问题,呵呵.可分辨美丑的能力还是有的. 所以......我豪不客气的第一时间征用了.加油,支持你.
 
32
2006/11/23 11:42 A.M. | 回复
很深奥，完全不知所云，呵呵。
 
33
2006/11/30 07:58 P.M. | 回复
我是千百度，怎么拷啊？不会弄。。要不我把我的帐户密码用短消息发给你。。你帮我弄下好么？ 拜托哥哥了
 
34
2006/12/02 08:12 P.M. | 回复
.你的博客确实很好看，欢迎到我那里指导
 
35
2006/12/08 09:01 A.M. | 回复
你的鼠标好漂亮啊...我也要 你还有PP的鼠标么..大象介绍给我个啊
 
36
2006/12/09 09:43 P.M. | 回复
高深莫测，望而却步。。。。。。。。。。。。
 
37
2006/12/13 05:40 P.M. | 回复
大哥 我有个问题想问你 我在使用你的模版后确实很开心 但是我现在想使用下自己做的模版 问题就出现了 为什么你做的模版不设置里没有模版设置呢？ 是不是用了你的模版后你就不允许别人更换别的模版了呢？ 0 麻烦你较我下 怎么样才能在是用你的模版时 能在设置里看见模版设置这4个字
 
38
2006/12/15 00:07 A.M. | 回复
那个是老模板的bug，新模板就没这个问题了~
 
39
2006/12/18 01:13 P.M. | 回复
这个模板设计真实太好了，素净，典雅！厉害厉害，是学美工的吗？
 
40
2006/12/18 03:18 P.M. | 回复
过奖了，业余爱好~
 
41
2006/12/25 08:04 P.M. | 回复
不错呀~~~~ 已经是很好了呀~~~ 历害呀~~~
 
42
2006/12/27 08:26 P.M. | 回复
用你的模版为什么图片出不来？
 
43
2006/12/27 10:12 P.M. | 回复
出来了大哥! 你做的太棒了! 我认为,百度的一等奖得归你！ 苹果电脑你当之无愧！ 我会一直支持你！
 
44
2007/01/13 10:06 P.M. | 回复
真的很佩服你!!!!!!!!
 
45
2007/01/15 01:38 P.M. | 回复
经典！加好友了
 
46
2007/01/18 10:55 P.M. | 回复
看了之后收益匪浅,我在弄空间方面暴没天分的说,佩服啊佩服~~
 
47
2007/01/21 02:52 P.M. | 回复
说;的好版权是自己的.只要你用智慧制作出的物品它就叫版权
 
48
2007/01/27 09:43 P.M. | 回复
margin和padding确实很难用到精确, margin是控制位置但填不进东西,而padding是可填充的,这是我大概的理解, 还有很多代码的区别我都不太懂,比如background和background-image的区别 还有怎么在分隔线的上方添加图片,怎么在上方和下方同时加图片? 有太多东西需要学习探索研究了,对于没有一丁点编程基础的人更是难上加难了
 
49
2007/01/28 04:41 P.M. | 回复
Tve I Qajg
 
50
2007/01/29 11:46 P.M. | 回复
正在钻研那个导航条，怎么立过来的！！在逼我干脆贴个图放在那里！！ 真是高手，原来是拼出来滴~~~我给你颁奖了，接着~~
 
51
2007/02/03 00:38 A.M. | 回复
还是不懂
 
[首页] 1 [2] [下一页] 
发表评论：
姓　名：
网址或邮箱： (选填)
内　容：
验证码： 请点击后输入四位验证码，字母不区分大小写
      

     

©2009 Baidu