首页 > 编程知识 正文

如何用css设计网页(html表格嵌套表格示例)

时间:2023-05-06 08:57:46 阅读:64260 作者:2318

最近,在一篇关于“框架”(Frames )的文章中,我开始思考网页设计的当前状态。 前几天发表了很多网络标准。 虽然使用CSS和XHTML开发web程序的优点越来越受到称赞,但许多开发人员群体依赖于使用HTML表单控制页面的输出。 请考虑使用HTML表单的好处和使用CSS方法的好处。

旧方法不一定不好

刚开始网页设计的时候,我对HTML表单的强大和灵活感到惊讶。 它们可以无限嵌套,以达到预期的设计。 此外,空白表格在浏览器中不正确显示的问题可以在空白GIF图像中修复。 但是,HTML和表背后的意思不是外观。

HTML表格用于设计演示文稿表格格式的数据。 所以,如果你希望数据看起来像excel,使用表格是最好的答案。 除了轻松应对这些数据外,早年的web开发人员很快发现表单是控制网页输出和外观的好方法。

将一个网页设计剪切到不同的表格是很容易的,但是手工编码相同的输出有点麻烦。 此外,在网页设计中嵌套了无数的表格,在需要更改时会成为头痛的问题。 幸运的是,像Frontpage这样的可视设计工具也能帮到你。 建议使用示例查看基于表的输出。

表格设计可以提供我们期望的设计结果,但最终的HTML代码有点难以理解。 使用表单的一个优点是,许多浏览器都支持,包括旧浏览器(如IE 5.0 )。 这一点与基于CSS的设计明显不同,但CSS有一些不同的优点。

突破新的应用

几年前,CSS刚成立的时候,web标准开始推行。 这是基于HTML旨在处理web内容。 也就是说,它不是为了处理数据而设计的。 因为CSS继承了这一设计原理,所以可以很容易地区分设计(HTML )和外观(CSS )。

首先,CSS用于处理文本外观(如颜色和字体),但它正在发展以支持各种外观元素。 CSS不仅简化了文本的外观和颜色,还提供了布局功能。 基于CSS的输出设计存在问题的是浏览器支持。 浏览器支持逐渐达到期望值,但旧的浏览器决不能支持。 如果支持有限,则有各种工作区和修改版本。

让我们将使用CSS开发的HTML示例与使用HTML表单的示例进行比较。 清单b中HTML源代码的外观与使用DIV标记定义页面的主要区域(页眉、菜单、内容和页脚)完全相同。 此外,菜单区域使用了未排序的列表。 CSS包含在HTML的“头”部分中。 它定义了不同DIV标记的外观规则。 这包括颜色和空白。

使用CSS输出的结果,设计变得简单了。 因为内容由HTML控制,外观由CSS轻松控制。 由于每个浏览器对CSS的支持略有不同,因此需要不懈地进行测试,并引入许多CSS修复以适应已知浏览器的差异。 这些修改(以及如何在传统浏览器中工作)不在本文的讨论范围内。

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。