第一课(X)HTML与CSS概述优秀课件.pptVIP

第一课 X HTML与CSS概述 第一课 X HTML与CSS概述 Web标准 X HTML基础 CSS基础 JavaScript基础 DW能做什么 DW的界面介绍 一个简单的网页制作 Web标准 WEB标准不是某一个标准，而是一系列标准的集合。网页主要由三部分组成：结构（Structure）、表现（Presentation）和行为（Behavior）。 “结构”、“表现”和“行为”分别对应于3种非常常用的技术，即? X ?HTML、CSS和JavaScript。 也就是说， X ?HTML用来决定网页的结构和内容，CSS用来设定网页的表现样式，JavaScript用来控制网页的行为。 Web标准 在一个网页中，同样可以分为若干个组成部分，包括各级标题、正文段落、各种列表结构等，这就构成了一个网页的“结构”。 每种组成部分的字号、字体和颜色等属性就构成了它的“表现”。 网页和传统媒体不同的一点是，它是可以随时变化的，而且可以和读者互动，因此如何变化以及如何交互，就称为它的“行为”。 因此，概括来说，“结构”决定了网页“是什么”，“表现”决定了网页看起来是“什么样子”，而“行为”决定了网页“做什么”。 Web标准 Web标准 主要原则是： （1）用标签元素描述网页的内容结构； （2）用CSS描述网页的排版布局； （3）用JavaScript描述网页的事件处理，即鼠标或键盘在网页元素上的动作后的程序。 Web标准 采用网站标准对网站浏览者的好处： ● 文件下载与页面显示速度更快； ● 内容能被更多的用户所访问（包括失明、视弱、色盲等残障人士）； ● 内容能被更广泛的设备所访问（包括屏幕阅读机、手持设备、搜索机器人、打印机、电冰箱等等） ● 用户能够通过样式选择定制自己的表现界面 ● 所有页面都能提供适于打印的版本 采用网站标准对网站所有者的好处： ● 更少的代码和组件，容易维护 ● 带宽要求降低（代码更简洁），成本降低。举个例子：当 ESPN.com 使用 CSS改版后，每天节约超过两兆字节（terabytes）的带宽。 ● 更容易被搜寻引擎搜索到 ● 改版方便，不需要变动页面内容 ● 提供打印版本而不需要复制内容 ● 提高网站易用性。在美国，有严格的法律条款（Section 508）来约束政府网站必须达到一定的易用性，其他国家也有类似的要求。 X HTML基础 HTML 是Hyper Text Markup Language的缩写，中文翻译为“超文本标记语言”，是制作网页的最基本语言。 Hyper（超）用HTML制作的网页可以通过其中的链接从一个网页“跳转”至另一个网页。 Text（文本）：HTML是一种文本解释性的程序语言，即它的源代码将不经过编译而直接在浏览器中运行时被“翻译”。 Markup（标记）：HTML的基本规则就是用“标记语言”——成对尖括号组成的标签元素来描述网页内容是如何在浏览器中显示的。 X HTML基础 但HTML存在很大的缺陷。首先，它只能使用固定和有限的标记；其次，把数据和显示格式存放在一起，使数据和格式分离比较困难等。随着Web的发展，人们意识到必须有一种方法能够将数据和显示格式分离开，于是决定开发一个新的SGML的简化子集，这就诞生了XML。 XML是为文档交换设计的，并以一种开放的、自我描述的方式定义的数据结构，是一种能够定义其他语言的语言，即可扩展。在描述数据内容的同时能突出对结构进行描述，从而更好的体现数据之间的关系。 X HTML基础 XML最初设计的目的是弥补HTML的不足，以强大的扩展性满足网络信息发布的需要，后来逐渐用于网络数据的转换和描述。应用XML，人们可以在自己的领域内自由地交换信息。 后来W3C又用XML设计了一个与HTML4.01功能相同的语言，使之与HTML相兼容，称为XHTML（可扩展超文本标记语言） XML虽然数据转换能力强大，完全可以替代HTML，但面对成千上万已有的站点，直接采用XML还为时过早。因此，我们在HTML4.0的基础上，用XML的规则对其进行扩展，得到了XHTML。简单的说，建立XHTML的目的就是实现HTML向XML的过渡。 X HTML基础 HTML最基本的语法就是： 内容 标记通常都是成对使用的，有一个开头标记就对应有一个结束标记。结束标记只是在开头标记的前面加一个斜杠“/”。 X HTML基础 在元素的起始标签中，还可以包含“属性”来表示元素的其他特性，它的格式是： 标签名称 属性名 “属性值” X HTML基础 html元素是网页文件的最外围的一对标签，它告诉浏览器整个文件是HTML格式，并且是从 开始，至 结束。 head元素包含的是网页的头部信息，它的内容主要被浏览器所用而不会显示在网页正文中。