WDF(15)
第三章 XHTML
教学内容
PPT21——
上节课我们介绍了XHTML的概念与基本内容，由于这一部分是建立在HTML基础之上的，所以讲的比较快，为了加深大家的印象，演示两个示例。
第一个示例中，我们要制作一个XHTML网页，工具使用Dreamweaver，但是我们不使用设计视图，而是使用Dreamweaver的代码视图，即直接在Dreamweaver中编写XHTML代码。使用的素材是我们实验中用到的WORD文档“通知.doc”。
我们说过，XHTML是为了描述文档的结构，而与文档中元素的表现无关，所以，我们只要在XHTML文档中使用相应元素定义标题、段落等就可以了，尽管如此，我们还是需要为以后的表现留有余地，如结合使用上节课介绍的div、span元素，以便在后续步骤中为网页内容指定不同样式。
第二个示例中，我们要为一个已有的HTML文档进行勘误，该文档中存在着不符合XHTML代码规范的地方，我们要对其进行修改，以使得该文档可以通过XHTML Strict的代码检查。
第四章 CSS
PPT22——
很明显，我们上面制作的XHTML文档并不能作为最终的结果呈现给浏览者，我们需要为其中的元素指定一定的样式，这样网页才更具有表现力。此时，我们就需要用到CSS。
CSS Naked Day
在CSS这一章中，我们要介绍的内容有五个小节，其中第一、二节是介绍性的内容，帮助大家理解CSS的基本概念和语法基础；第三、四节是CSS的具体性内容，内容比较庞杂；第五小节是总结性的内容，主要介绍使用XHTML + CSS进行布局的方法。
PPT23——
最初Web设计人员设计出HTML，主要侧重于定义内容，比如<p>表示一个段落，<h1>表示一级标题，而并没有过多设计HTML的排版和界面效果。
随着Internet的发展，HTML被广泛应用，上网的人们当然希望网页做得漂亮些，因此HTML排版和界面效果的局限性日益暴露出来。为了解决这个问题，人们也走了不少弯路，用了一些不好的方法，比如给HTML增加很多的属性结果将代码变得很臃肿，将文本变成图片，过多利用表格来排版，用空白的图片表示白色的空间等。
CSS可算是网页设计的一个突破，它解决了网页界面排版的难题。可以这么说，(X)HTML的元素主要是定义网页的内容(Content)，而CSS决定这些网页内容如何显示(Layout)。
CSS的英文是Cascading Style Sheets，中文可以翻译成层叠样式表。
PPT24——
CSS按其位置可以分成三种：
u 内嵌样式(Inline Style)
u 内部样式表(Internal Style Sheet)
u 外部样式表(External Style Sheet)
内嵌样式写在元素的开始标签里面，使用style属性进行指定，只对所在的元素有效。
内部样式表一般写在HTML文档的<head></head>里面，样式的定义包含在style元素的开始和结束标签之内，只对所在的网页有效。
如果多个网页需要用到相同的样式，怎么办？
可以将样式定义在一个以.css为后缀的CSS文件里，然后在每个需要用到这些样式的网页里引用这个CSS文件，引用方法是在文档的<head></head>之间添加空元素link，并指定该元素的href属性为要引用的.css文件的路径。
使用外部样式表，相对于内嵌和内部式的，有以下优点：
u 样式代码可以复用。一个外部CSS文件，可以被很多网页共用。
u 便于修改。如果要修改样式，只需要修改CSS文件，而不需要修改每个网页。
u 提高网页显示的速度。如果样式写在网页里，会降低网页显示的速度，如果网页引用一个CSS文件，这个CSS文件多半已经在缓存区(其它网页早已经引用过它)，网页显示的速度就比较快。
CSS第一个字母，是Cascading，意为层叠。它是指不同来源的样式可以合在一起，形成一种样式。
Cascading的顺序是：
1. 浏览器缺省 (优先级最低)
2. 外部样式表
3. 内部样式表
4. 内嵌样式表 (优先级最高)
假设内嵌样式中有font-size:
PPT25——
CSS语法中的三个组成部分：选择器（selector）、属性名和属性值。
样式的定义使用{}括起来，属性名和属性值之间使用:隔开，多个不同的属性设置中间使用;分割。
本章的第三、四节主要介绍详细的内容。
PPT26——
注释主要是方便自己或他人以后更容易理解代码，为代码添加注释是一种较好的编程习惯。
Life is like a boat, and I'm at sea.
浙公网安备 33010602011771号