基于表现与结构分离的网页布局实践_第1页
基于表现与结构分离的网页布局实践_第2页
基于表现与结构分离的网页布局实践_第3页
全文预览已结束

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

1 / 3 基于表现与结构分离的网页布局实践 基于表现与结构分离的网页布局实践 闻立鸥 (北京财贸职业学院,北京 101101) 摘要:表现与技术相分离来制作网页已经是一种必然趋势。可以在网页结构不变的情况下,通过修改样式表文件实现页面重构,变换网页的表现风格。不仅大大提高了页面的制作效率,而且提高了网站的维护效率。本文通过案例的制作,将表现与结构分离的网页布局实践过程与大家分享。 关键词:表现;结构;网页布局 作者简介:闻立鸥( 1971-),女,副教授,主要从事计算机应用方面的研究 。 一、引言 随着 Web 标准化设计理念的普及, DIV+CSS 进行网页制作已经是必然趋势,网页制作人员应该顺应网络技术的发展,及时更新技术手段。学会通过 HTML 语言构建网页的语义化结构并尽可能优化,然后运用 CSS 样式表文件呈现网页的可视化效果,实现网页的表现与内容的分离。大大减少了代码冗余,提高网页制作效率,改善网页浏览质量。 二、内容与表现相分离技术简介 内容和表现相分离,是目前标准技术制作网页最基本2 / 3 的方法,也是 CSS 网页布局重要的目标之一。基本的制作流程是,先分析规划切割效果图, 接下来使用可扩展的超文本标记语言搭建网页内容结构,然后利用样式表文件“还原”出与效果图一致的页面效果。如果要实现网页内容和外观样式的完全分离,应创建一个新的样式文件,然后以链入外部CSS 样式表的方法将这个样式文件链接到网页文档中。这样就完全做到网站的维护人员可通过修改样式文件来改变页面风格,修改网页文件来改变内容,互不干扰。 三、表现与结构分离技术制作网站流程解析本案例为个人网站,包括首页和相关二级页面,首页效果图如下。所有页面布局整齐且风格统一。使用表现与结构分离技术制作流程如左图。 1. 利用 XHTML 构建整体网页的结构。 四、结语 采用结构与表现相分离技术制作网页,在“表格时代”是不可能实现的。如果要修改网页的外观风格,直接修改 CSS样式文件代码即可,准确而快捷呈现效果图的显示效果。但3 / 3 是如果按照 WEB 标准更加专业更加规范设计网页,还需要熟练运用 XHTML 与 CSS 代码,加强实践,认真思考并尝试运用多种方法去解决实践中出现的问题。 参考文献: 1闻立鸥。网页制作实用教程 M.北京:清华大学出版社, 2016. 2柯海鹏。任务驱动法在 DIV+CSS 网页布局技术中的教学探索 J.教师, 2016,( 22)。 3 关秀英。 Flash CS4 商业动画、片头与网站设计案例精解 M.北京:清华大学出版社, 2016. 4闻立鸥。 DIV+CSS 之布局一行三列页面实证分析J.教

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论