«
»

又一个Z-BLOG 经典三栏主题

December 5th, 2007

在ZBLOGGER BBS里面有MSNSPACE经典三栏主题提供下载，不过Sino Blog 觉得该主题的CSS写的不太合理，太过于冗余，从而导致DIV布局之后的，博客页面载入速度大打折扣，而Sino Blog 对页面的浏览速度有着近乎BT的要求。

Z-BLOG的Default3主题的CSS写的非常漂亮，Sino Blog 所使用的三栏模板都是在Default3主题上基础上做的修改，昨天晚上睡觉的时候突发奇想，觉得如果把Default3主题改成经典三栏主题应该会更好看，然后今天早上一起床就开了电脑立马实现我的想法。出乎我之前的意料，只是对CSS做了很小的改动就搞定了，先前还以为要更改TEMPLATE下的5个.html里的DIV，具体步骤如下：

只要将Default3主题CSS里面的

  1. #divSidebar{
  2. width:210px;
  3. margin:0 auto;
  4. padding:0 0 10px 0;
  5. text-align:center;
  6. float:right;
  7. border-left:1px dashed silver;
  8. }
  9.  
  10. #divSidebar2{
  11. width:210px;
  12. margin:0 auto;
  13. padding:0;
  14. text-align:center;
  15. float:right;
  16. }
  17.  
  18. #divMain{
  19. width:555px;
  20. margin:0 0 0 0;
  21. padding: 0;
  22. text-align:left;
  23. float:left;
  24. background-color:#F6F6F6
  25. }

改为：

  1. #divSidebar{
  2. width:210px;
  3. margin:0 auto;
  4. padding:0 0 10px 0;
  5. text-align:center;
  6. <span style="color: #ff0000;"> float:left;</span>
  7. border-left:1px dashed silver;
  8. }
  9.  
  10. #divSidebar2{
  11. width:210px;
  12. margin:0 auto;
  13. padding:0;
  14. text-align:center;
  15. float:right;
  16. }
  17.  
  18. #divMain{
  19. width:555px;
  20. margin:0 0 0 0;
  21. padding: 0;
  22. text-align:left;
  23.  float:right;
  24. background-color:#F6F6F6
  25. }

OK，就这么简简单单的搞定了，在IE 7.0，Firefox下没有错位出现。

Sino Blog 觉得，独立博客的乐趣就在于：能将自己的想法付诸行动然后变为现实，而且这也是一个从学以致用的过程。

作者： | 分类: 博客世界 | 标签: , | 浏览: 731

Comments are closed.