这不是布局,是结构。这是一个对内容块的语义说明。当你理解了你的结构,就可以加对应的ID在DIV上。DIV容器中可以包含任何内容块,也可以嵌套另一个DIV。内容块可以包含任意的HTML元素---标题、段落、图片、表格、列表等等。根据上面讲述的,你已经知道如何结构化HTML,现在你可以进行布局和样式定义了。每一个内容块都可以放在页面上任何地方,再指定这个块的颜色、字体、边框、背景以及对齐属性等等。用CSS替换传统方法下面的列表将帮助你用CSS替换传统方法:HTML属性以及相对应的CSS方法HTML属性
clear:left;clear:right;clear:both;许多2列或者3列布局都使用float属性来定位。如果你在浮动层中定义了背景颜色或者背景图片,你可以使用clear属性.cellpadding="3"vspace="3"hspace="3"padding:3px;用CSS,任何元素都可以设定padding属性,同样,padding可以分别设置top,right,bottomandleft。padding是透明的。align="center"text-align:center;margin-right:auto;margin-left:auto;Text-align只适用于文本.象div,p这样的块级怨毒可以通过margin-right:auto;和margin-left:auto;来水平居中
一些令人遗憾的技巧和工作环境
EricMeyer的《ContainingFloats》将帮助你掌握如何使用float属性布局。float元素有时候需要清除(clear),阅读《HowToClearFloatsWithoutStructuralMarkup》将非常有帮助。更多帮助
已有的《CSSDiscussion》列表是很好的资源,它收集了一个WiKiA讨论组的信息,其中包括CSS布局总结(css-discuss.incutio.com/page=CssLayouts),CSS技巧总结(css-discuss.incutio.com/page=CssHack)以及更多
因为互联网是互通的,所以任意的两个或者以上的网页文档都可能会涉及到数据交换,而因为XML语言是允许用户自定义标签的,所以任意两个交换的文档就可能会出现相同的标签,从而导致相同标签的冲突,所以就需要一个命名空间以区分开交换文档中可能存在的相同标签。
XHTML做为HTML向XML过渡的一种语言,并不能实现XML语言中的用户自定义标签,所以XHMTL文档中的命名空间都是相同的:
utf-8是unicode的一种变长度的编码表达方式,做为一种全球通用型的字符编码正越来越多的网页文档所使用,使用utf-8字符编码的网页可最大程度的避免不同区域的用户访问相同网页时因字符编码不同而导致的乱码现象。
当然,除了gb2312外还有一些网站使用gbk或者是gb18030编码,这三种字符编码都是属于简体中文字符集。也就是说,如果一台电脑没有安装简体中文字符集时,当它访问字符编码为gb2312的中文网页时,则显示出来的是乱码。
既然使用gb2312字符编码时会因为不同区域的用户访问而可能出现乱码现象,那为何不使用utf-8呢?
其中一个原因可能历史遗留的原因,而另一个更重要的原因应该是由于两种编码的存储方式不同而造成的文档体积不同。
使用gb2312字符编码集时,一个汉字是占用2个字节的大小,而一个汉字在utf-8编码中所占的字节数却往往都是在3个字节,甚至是3个以上的字节。所以对于同一个中文文档来说,使用gb2312字符编码来进行存储的体积是要小于utf-8编码所存储的文档大小的。
而对于文字多访问量大的中文网站来说,使用gb2312编码的网页文档在下载传输上可以节省下不小的流量,再者是因为中文网站的用户群体基本上都锁定在中文用户上,这些也就是很多网站使用gb2312编码而不是utf-8编码的原因。
但是文字多访问量大的网站,国内并不多,再加上可能成对的乱码问题,所以在制作网页的时候推荐使用utf-8编码。
当然,不管用何种编码,最重要的是整站使用的编码要统一。
在较早之前的网页上,我们经常可以看到如下的网页结构代码:
这是一个网页
……
很显然的,这种结构的网页代码是不符合Web标准规范的,但是浏览器仍然可以很好的呈现出这个网页来,只要代码没出什么错误。这个其实就像是用Table布局的页面跟Div构架的页面一样,浏览器都可以呈现出来,关健是哪个页面呈现的质量会更高。
做出一个页面,跟做好一个页面,中间有着很遥远的距离。
在浏览器的发展历程中,微软凭借着将InternetExplorer捆绑进Windows操作系统中,从来成为浏览器市场上的霸主,从而也造成了一系列的IE对W3C组织所制定的Web标准于不顾的事情,微软的IE一直都只遵循自家的Web标准。很庆幸的是,微软决定在他的IE8中支持Web标准,虽然这事还没最终确定。除微软的IE外,MozillaFirefox、AppleSafari、Opera、Chrome等浏览器则以支持Web标准的名义与IE做得长久的对抗。
Transitional(过渡的):要求不是很严格的DTD,允许你继续在页面中使用HTML4.01的标签;
Strict(严格的):这是制作页面时理想的DTD方式,但是这个文档类型定义不允许使用任何的表现层上的标签和属性;
Frameset(框架的):这个专门针对页面设计中包含有框架的DTD。
由于框架型的设计可能对网页在搜索引擎中收录的影响,很多网页中都不使用框架设计;而Strict的DTD对于大多数人来说还只是一种理想化的方式;Transitional型的DTD则是目前最适用也是使用最广泛的文档类型定义。
过渡的DTD:
严格的DTD:
在HTML4Elements中共计有91个标签,然而在这么多的标签中经常被使用到的标签不到四分之一,在这些常用的标签中有两个标签是属于最通用型的——div、span,这两个结构性的标签因为本身不带呈现样式及语义而被广泛的用于网页制作中,再加上之前很多人直接把WEB标准误解为就是div+css,于是在一个页面里出现了特多的div或者是span标签,尽管这些地方本身有更符合语义的标签来实现。
于是Web标准中的结构标签几乎变成了div的秀场。
div标签的过度使用,已经导致了很多人对于Web标准的误解,最明显的一点就是,当网页切换到使用div标签布局后,table标签便被无情的抛弃,俨然Web标准已经被理解成就是div+css。而事实上,table标签是不能被抛弃的,当需要显示数据内容时,由table标签构建的HTML结构的优势要强于div标签构建的布局,table标签仍然是显示数据时最符合HTML语义的标签。
Table页面布局所生成的过多的冗长代码,以及混杂其中的HTML样式属性,已经严重影响到页面的性能,尤其是对于大访问量的网站,解决的方法即是对页面进行基于Web标准的重构。然而对Web标准的误解,造成页面整体结构上div被过多的使用;以及Table布局所遗留下来的思想,造成页面上的结构嵌套过多。这些仍然影响着页面的整体性能。
所以,以更符合语义化的标签来构建页面,是Web标准推崇的理念。在这个理念下构建的页面还应该尽量的精简代码,使页面代码尽量的保持轻简,让浏览器更快速呈现的同时也便于日后的代码维护。
Web标准并不是某一个单独的标准,而是一系列标准的集合,包括结构、表现、行为三部分。这里的结构并不是指div,而是指标准化的语言——XHTML、XML。
明明标签可以实现粗体样式,为什么还要用标签再搭配粗体样式去实现呢?
在许多人看来,HTML应该是WEB制作所有语言中最简单的语言,因为它不需要编译、封闭等,甚至只需要一个记事本就可以让其在浏览器中呈现出来。所以我们也看到很多人都在说HTML很简单超简单之类的话,网上也有很多诸如“花个两三天学习下HTML就可以制作网页”之类的理论。在这些人看来,学HTML就像是学英文字母ABC一般简单。
正是这样的理论这样的思想,导致学习HTML的人都不把它当回事,认为HTML仅仅只是诸如“加粗用标签,斜体用标签”之类的应用。这样的思想尤其是在初学者当中流传,而一旦真正深入的了解学习HTML之后,才会发现HTML远非想像中的那么简单。
而随着WEB标准大潮的席卷互联网,更多的人索性就差不多抛弃HTML众多标签般的只用DIV,似乎DIV+CSS就是WEB标准的核心。这个错误的理论与HTML超简单的理论被绑在了一起,在互联网中传播着。思想改变行动,最终造成了WEB标准在国内互联网推行的困难重重。
真正的WEB标准应该是推崇以更合适的语义标签来制作网页结构,完全不是在整个页面写满DIV就是符合WEB标准。与此相同的道理是,HTML远远不是你所想像中的那么简单。
一个网站在浏览器中呈现效果的好坏,视觉因素占一半的比重,而另一半的比重就在于网页的结构上。
我们可以在网上看到很多整个页面都是由DIV架构的网页,这些DIV结构的页面在配合上CSS时,整个页面在浏览器中呈现的也许很正常,并看不出什么问题。可是如果用户禁用掉CSS之后呢?浏览器还能否正确的理解网页结构并呈现出来,就成了判断这个网页结构好坏的很重要的一个标准。而对于这些完全由DIV结构组成的页面,很显然的,在CSS被禁用之后,浏览器就很难呈现出一个结构清晰明了的页面来,而用户自然也很难从结构上去判断哪些内容是标题,哪些内容是真正的内容。
而如果在页面中采用了更符合语义的HTML标签的话,即使CSS样式在被禁用之后,浏览器依然可以根据标签来显示成标题,根据
标签来显示成段落,最终仍然可以为用户呈现出结构清晰明了的页面。如果把网站建设比喻成是建造一栋大厦,那么HTML无疑就是这栋大厦的基石,如果基石不够坚稳的话,那么这栋大厦就很有可能会面临倾倒的危险。
简单说就是不用HTML+table来设计页面,改用XHTML+CSS来实现。
怎样是代码校验
代码校验就是检查你制作好的页面是否完全符合web标准。通常可以到W3C的网站去校验。
什么是DocType,有什么用
DOCTYPE是documenttype(文档类型)的简写,用来说明你的网页是什么标识语言(XHTML或者HTML)是什么版本。
我应该使用是么样的DOCTYPE
初次学习web标准的设计师推荐使用XHTML1.0过渡式的DTD,代码如下:
遵循web标准就不能使用表格了吗
可以使用表格。只是表格仅仅用于其本意:展示数据列表。而不允许使用表格排版和定位。
遵循web标准可以使用Flash吗
可以。但是
不用表格可以制作出漂亮的页面布局吗
可以。CSS可以实现几乎所有用table实现的布局。参考成功网站:www.macromedia.com,www.mp3.com,www.blogger.com,www.espn.com
有什么关于web标准好书推荐吗
web标准的概念和实践推荐Zeldman的《网站重构--用web标准进行设计》;CSS入门和进阶推荐EricMeyer的《CSS权威指南》《MoreEricMeyeronCSS》。
CSS布局比表格难吗
这要看你怎么想了。变革和观念转换总是有困难的,你认为这个转变是值得的,那么你会发现CSS并不比表格难。
表格布局是不是马上要淘汰了
经过1天多的艰苦奋战,终于把html(Hypertextmarkuplanguage)的基础教程给看完了。
这次为了xml而看了这“古老”的技术,还是有点收获的。。总体来说,虽然不是很熟练,但是看懂一般的html网页源文件已经不是问题了。闲来无事,就写写笔记吧,说说感受也好!
1总体架构
html给我的感觉是很标准,很有格式的。最主要的代码特点就是标记成对的出现,虽然有些可以省略,但是建议除非太过烦琐还是把前后都加上去吧!作为一个完整的html网页,总是有头部,主体和结尾3大部分,分别用
,和