使用html表格和CSS进行混合网页设计

  次阅读 作者:智能小宝 来源:互联网 2016-03-25 16:42 我要评论(0)

最近一篇关于桢(Frames)的文章让我开始考虑网页设计的当前状态。不久前公布了许多的网页标准。使用CSS以及XHTML开发网页程序的优点正日益得到人们的称颂,但仍有许多 的开发者团体更依赖于使用HTML表格来控制页面的输出。让我们来考虑一下使用HTML表格和使用CSS方法的各自优点。

老方法未必不好

当我刚开始进行网页设计时,我吃惊于HTML表格的强大和弹性。它们可以被无穷嵌套以达到预期的设计效果,而原先空白表格无法在浏览器中正确显示的问题则可以通过空白GIF图 片予以修正。但是HTML和表格背后的意义并不在于外观。

HTML表格用于设计呈现表格式的数据。所以,如果你希望数据看起来像在Excel中那样,那么使用表格就是最佳答案。除了毫不费力的应付这些数据,早年的网页开发者们迅速发现 了表格还是控制网页输出与外观的绝佳办法。

将一个网页设计切割成不同的表格是很简单的事情,但是要手工编码完成同样的输出可就有些麻烦。另外,网页设计中无数嵌套的表格在需要改变时就成了令人头痛的梦魇,好在 类似Frontpage这样的可视化设计工具还可以助你一臂之力。要展示基于表格的输出,有个好方法就是使用一个示例。

表格设计可以提供我们期望的设计结果,但是最终的HTML代码就有点不好理解了。使用表格的一个有利方面是众多浏览器全都支持,包括类似IE 5.0这样的古老浏览器。这一点和基 于CSS的设计明显不同,但是CSS有一些不同的优点。

突破新的应用

几年之前,当CSS刚刚成型之时,网页标准就开始推行了。它的建立基于HTML被设计用于处理网页内容的事实。这意味着,它不是设计用于处理数据的。CSS继承了这个设计原理, 允许你很容易的将设计(HTML)和外观(CSS)区分开来。

首先,CSS是用于处理文本的外观,比如颜色和字体,不过逐渐成长为支持各种外观因素。除了简化文本外观以及颜色外,CSS还提供了布局功能。基于CSS的输出设计有个问题就是 浏览器的支持。浏览器的支持正在慢慢达到期望值,但是古老的浏览器永远也不可能支持。在支持有限的情况下,又有多种不同的工作区和修改版本。

让我们来看个使用CSS开发的HTML示例,和使用HTML表格的做个对比。在列表B中的HTML源代码,其浏览外观和使用DIV标记定义页面主要区域(题头,菜单,内容和页脚)的效果完 全相同。另外,菜单区使用了一个未排序的列表。CSS被包含在HTML的“head”部分中。它定义了不同的DIV标记的外观规则。这包含了色彩和空白。

使用CSS输出的最终结果是设计更简单,因为内容将由HTML来控制(没有了表格,HTML源代码阅读起来也简单多了),而外观则简单的交由CSS来控制。因为对CSS的支持各个浏览器 有些差异,所以你必须努力不懈的进行测试,并部署许多的CSS修改以适应已知的浏览器差异。至于这些修改(以及如何在老式浏览器中工作),则不在本文的讨论范围之内了。

本站文章信息来源于网络以及网友投稿,本站只负责对文章进行整理、排版、编辑,是出于传递更多信息之目的,并不意味着赞同其观点或证实其内容的真实性。如果您有什么意见或建议,请联系QQ28-1688-302!

人工智能实验室
相关文章相关文章
  • 英国研发“杀生”机器人 通过生命体获取能量

    英国研发“杀生”机器人 通过生命体获取能量

  • 韩春雨称已能重复实验结果 近期将有消息公布

    韩春雨称已能重复实验结果 近期将有消息公布

  • 未来两年人工智能要怎么走?看这篇就够了

    未来两年人工智能要怎么走?看这篇就够了

  • 无人驾驶汽车如何改变城市生活?听听他们怎么说

    无人驾驶汽车如何改变城市生活?听听他们怎么说

网友点评网友点评
阅读推荐阅读推荐

据国外媒体报道,在过去两年内,聊天机器人(chatbot)、人工智能以及机器学习的研发和采用取得了巨大进展。许多初创公司正利用人工智能和...

霍金 视觉中国 图 英国著名物理学家霍金(Stephen Hawking)再次就人工智能(AI)发声,他认为:对于人类来说,强大AI的出现可能是最美妙的...

文|郑娟娟 今年,人工智能(AI) 60岁了。在AI60岁的时候,笔者想要介绍一下AI100,一个刚刚2岁的研究项目,但它的预设寿命是100年,甚至更长...

AlphaGo与李世石的人机大战,为大众迅速普及了人工智能的概念。 但对谷歌而言,除了下围棋,现在的人工智能进展到哪一步了?未来,人工智能...