首 页 关于我们 网站设计 网络推广 成功案例        服务流程    联系我们
海南网站建设客服中心 客服中心
  地址:海口市白龙南路工业和招商局一楼
  电话:0898-66689856 66689169
  邮箱:worldfy@163.com
  Q Q:447153201
  在线咨询:(点击QQ图标在线咨询)
  海南网站设计客服一 业务一部杨经理
  海南网站制作客服二 业务二部林经理
 

HTML文档结构对Div+CSS布局的意义

 

时间: 2008-11-17 14:42:17 作者: 海南网站制作 点击:

Web标准的要把握几点:

使用结构化,语义化的标签

使用CSS分离出(X)HTML文档中的表现元素

依靠Javascript去增强,而不是替代,网站的特征(举个例子就是如果css做不了的,交给Javascript而不是替代css去做他能做的)

对样式组合方式是这样的

<div class=”class1 class2 … classn”></div>

举个布局例子

<div class=”f-left w400 bgfff”>

几个类组合成一个左浮动,宽400 背景为白色的一个区域

你可能拥有一个庞大的库,页面只需要任意的class的组合就可以完成,省去大部分花费在css上的时间,可是带来的是结构的混乱,改版的困难,甚至向后兼容受到限制。这样做和table布局没什么两样,只是代码看着好看而以,而且代码量相差也不会太大。在应用web标准初期,合理的table布局也是允许的。

如此多的class让我想起了table冗长的属性

<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 ALIGN=CENTER WIDTH=100% HEIGHT=100%>

难道辛辛苦苦就是想使用div配合css模拟出一个table很容易实现的效果?而且达到和table布局一样的拙劣?

语义化也是结构的一个部分,语义除了合理的使用(X)HTML标记语言,id也是一个语义组成的部分,div的id就像一个即时贴,告诉你某个div的语义,告诉你这个区块的意义。

微格式(Microformat)是在标准 XHTML 代码中嵌入结构化数据的一种新方法。他的诞生也很明确的说明了web的结构永远是第一位,语义化的优势很现实的体现出来,div的属性规划也体现着语义,而不仅仅是一个传递给样式工作的接口。可以去看看ibm文档中心的一篇“使用 microformats 分离数据与格式”了解它的工作原理。

 

相关资讯:
Copyright 2008 海南网页设计制作|海南网站设计制作 All Right Reserved
地址:海口市白龙南路工业和招商局七楼  电话:0898-66689856/66689169  业务手机:13307575371
热门搜索:海南网页设计海南网页制作海南网站设计海南网站制作海南网站建设海南网络公司海南做网站