南通SEO,南通网络营销顾问任伟SEO博客

首页> 网站建设> Z-blog > Z-blog默认模板的页面模型分析
647Views

Z-blog默认模板的页面模型分析

作者: 发布于 0 条评论 字体大小[]

  制作Z-Blog的样式,首先要对Z-Blog的页面元素、布局要有了解,再配合CSS、图像处理等技术,就可以制作了。

  Z-Blog采用了页面表现、样式与内容分离的技术,也算是Web Standards其中的一环了,好处就是可以通过更换CSS样式表,表现出不同的外观,让你的网站显得更活泼、有趣。

  页面全局的元素布局

  全局

  为什么全局DIV块嵌套了3回,这是为了应付一些特殊的样式需求。另外,如果要列表页和单日志页产生不同的效果,就要设置body的class了。

  DivPage块

  每一个divPage块中的元素都是一样的,总共有5大块:divTop,divNavBar,divMain,divSidebar,divSidebar,divBottom,你可以在CSS中控制导航条或是工具栏等的显示与否。

  翻页条放在了class=“post”的div块里,将会设置了两个class,既class=“post pagebar”

  每页的发表评论框只会有一个,所以也设置了id=“divCommentPost”

  日志与分栏

  Z-Blog中的分块要属div class=“post”,ul class=“msg”,div class=“function”,将整体的页面CSS设置完,就要细化设置分块的CSS属性。

  div class=“post”是日志显示部分的元素,它拥有多重class,这样可以方便的定制不同分类或是不同作者的日志显示效果。

  ul class=“msg”控制显示留言和评论。

  div class=“function”是工具栏上的分块,部分分块设置了id,这使得改变不同分块的显示效果变的很容易。

  相关参考:默认模板右侧栏目代码整理和注释

  软件与测试

  样式做的好不好,是不是在通用的浏览器中显示都正常,这就需要不断的测试了,下面就推荐几个流行的浏览器:

  IE

  IE是龙头老大,所以样式在IE下显示一定要正常,IE6的性能是很不错的呢,唯一感觉就是跟不上标准,对CSS支持也不够好,比如first-child等。我主要是针对IE6,对于IE5基本上没什么关注。

  FireFox

  Mozilla FireFox是近两年最火的浏览器,想不看到它都难,更新快,支持DOM标准(IE对DOM的实现有时真让人恶心),支持CSS也很好,附带的DOM Inspector查看器是调试网页的利器,无论是JS脚本还是CSS,一定能用的上的。

  下载:http://www.mozilla.org/

  Opera

  目前Opera 已有了长足的发展,解决了显示中文的BUG,改进了JS及CSS支持,有和FireFox一拼的实力了。

  下载:http://www.opera.com/

分享来源: 任伟SEO博客 转载请注明出处!(QQ交流:547701130/微信:renweiseo/微信公众号:renwei_seo)
原文地址:http://renweiseo.com/2210.html
发布于 2016-06-01 09:59:31 已有0人评论 迩丶の緈諨 作者保留权利

发表评论

必填

选填

选填

必填

已有0人参与,欢迎参与讨论,请在这里发表您的看法、交流您的观点。

亲!看完有什么想法呢?
  • 流泪

    0

  • 打酱油

    0

  • 开心

    0

  • 鼓掌

    0

  • 恐怖

    0

作者介绍

  • 迩丶の緈諨
  • • 主页:
    • 文章:
    • 邮箱:

    SEO是通过对网站的内容,结构,外链等方面进行优化,使网站更符合搜索引擎的抓取,从而提升搜索结果排名,提升网站流量的手段。

    控制面板

    您好,欢迎到访网站!
      查看权限
    «   2021年11月   »
    1234567
    891011121314
    15161718192021
    22232425262728
    2930