ASP,NET3,2静态网页设计.pptVIP

任务实施 单击【确定】按钮，header标签插入成功，其它块的插入方法类同。“中国无锡质量网”首页网页结构代码如下： div id=header此处显示 id header 的内容/div div id=nav此处显示 id nav 的内容/div div id=maincontent div id=side此处显示 id side 的内容/div div id=main此处显示 id main 的内容/div /div div id=footer此处显示 id footer 的内容/div 从上图分析得知，整个网页是居中浏览器显示的，按照这样的写法需要把以上的header、 nav、maincontent、footer都设置宽度并居中，这样做起来很麻烦，所以再在这些标签 外增加一个父标签，设置这个父标签宽度并居中后，那么所有的标签都居中了。 增加后的代码如下： 任务考核 div id=container div id=header此处显示 id header 的内容/div div id=nav此处显示 id nav 的内容/div div id=maincontent div id=side此处显示 id side 的内容/div div id=main此处显示 id main 的内容/div /div div id=footer此处显示 id footer 的内容/div /div 任务实施 ③ 设置CSS样式表，定义全局样式。DIV框架代码写完后，接下来就需要设置css样式表了。“中国无锡质量网”整体宽度是996px，（注意： 设置container也是这个宽度并居中）其中main部的宽度为765px，side宽度为205px。把这三个基本的宽度确定好后，下面就可以写css代码了。由于本实例是按照实际当中应用来做的，所以css样式表就最好写在单独文件里了，不要再写在文件内部了，这样可以利用代码的重用性，减少很多劳动强度。下面就新建一个css样式表文件：在DW文件菜单选择【新建】，然后在打开的窗口页面类型中选择【css】，如图3-12所示： 图3-12 新建CSS文件 任务描述 掌握XHTML语言 掌握CSS样式表 任务目标 知识目标 能力目标 每一个网站都需要进行页面的布局，用户看到的每一个页面都需要编写相应的XHTML语言（或者是HTML语言）进行布局，然后在布局好的页面的基础上进行相应功能程序的编写，页面布局的好坏直接影响到用户对使用该系统或者网站的整体感受。 掌握进行页面布局的方法 相关知识 1．XHTML语言 1）XHTML语言简介 XHTML是The Extensible HyperText Markup Language（可扩展超文本标识语言）的缩写。HTML是一种基本的Web网页设计语言，XHTML是一个基于XML的置标语言，看起来与HTML有些相像，但有一些小的却重要的区别，XHTML就是一个扮演着类似HTML角色的XML，所以，本质上说，XHTML是一个过渡技术，结合了部分XML的强大功能及大多数HTML的简单特性。 相关知识 2）XHTML语言的形成背景 2000年底，国际W3C（World Wide Web Consortium）组织公布发行了XHTML 1.0版本。XHTML 1.0是一种在HTML 4.0基础上优化和改进的新语言，目的是基于XML应用。XHTML是一种增强了的HTML，它的可扩展性和灵活性将适应未来网络应用更多的需求。XML虽然数据转换能力强大，完全可以替代HTML，但面对成千上万已有的基于HTML语言设计的网站，直接采用XML还为时过早。因此，在HTML 4.0的基础上，用XML的规则对其进行扩展，得到了XHTML。所以，建立XHTML的目的就是实现HTML向XML的过渡。目前，国际上在网站设计中推崇的Web标准就是基于XHTML的应用（即通常所说的CSS+div）。 相关知识 3）XHTML与HTML的区别 （1）所有的标记都必须要有一个相应的结束标记 在HTML中可以打开许多标签，例如，可以只写标记li，而不一定写对应的/li来关闭它，但在XHTML中这是不合法的。XHTML要求有严谨的结构，所有标签必须关闭。如果是单独不成对的标签，在标签最后加一个“/”来关闭它。例如： img height=80 alt=网页设计师 src=../images/logo_w3cn_200x80.gif width=200 / （2）所有标签的元素和属性的名字都必须使用小写 与HTML不一样，XHTML对大小写是敏感的，title和TITLE是不同的标签。XHTML要求所有的标签和属性的名