
chap02XHMTL语言基础课件.ppt
67页第第第第2 2 2 2章章章章 XHMTLXHMTLXHMTLXHMTL语言基础语言基础语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础主要内容主要内容2.1从HTML到XHTML2.2网页文本及标记2.3使用页面列表2.4超链接东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室2.5插入多媒体和表格2.6表单和框架chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室2.1 2.1 从从HTMLHTML到到XHTMLXHTMLHTMLHTML:应用广泛,使用简单,应用成熟着重于将文件数据显示在浏览器中XMLXML:着重于将文件数据以结构化的形式展示•RSS订阅的基础XHMTLXHMTL:以HTML为范本,依XHMTL的语法重新规范HTML语言,W3C希望最终能够以XHTML取代HTMLchap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室2.1 2.1 从从HTMLHTML到到XHTMLXHTML2.1.1 2.1.1 初识初识HTMLHTML标记标记•实例:•主要规则:−以“<标记名>”表示标记的开始,以“标记名>”表示标记的结束 。
−成对标记又称之为容器,一对标记中还可以嵌套其他的标记 −单独标记不需要与之配对的结束标签标记,又称之为空标记,例如
−属性设置的一般格式为:属性名=属性值,属性值部分可以用英文的双引号( " )或单引号( ' )引起来,也可以不使用任何引号 chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室2.1 2.1 从从HTMLHTML到到XHTMLXHTML2.1.2 HTML2.1.2 HTML文档的基本结构文档的基本结构chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室2.1 2.1 从从HTMLHTML到到XHTMLXHTML2.1.3 XHTML2.1.3 XHTML文档的新增规范文档的新增规范•(1) XHTML文档的基本结构增加了声明文档类型部增加了声明文档类型部分分 增加了命名空间的声明增加了命名空间的声明部分部分 在文档头部分强制要求在文档头部分强制要求声明所用的语言编码声明所用的语言编码 chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室2.1 2.1 从从HTMLHTML到到XHTMLXHTML2.1.3 XHTML2.1.3 XHTML文档的新增规范文档的新增规范•(2) 代码规范−①所有的标记都必须要有一个相应的结束标记。
−②所有标记的名称和属性的名字都必须使用小写 −③所有的标记都必须合理嵌套−④所有的属性值必须用双引号括起来−⑤把所有的“<”、“>”和“&”特殊符号用编码表示−⑥给所有的属性赋一个值−⑦不要在注释中使用“--”chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室2.1 2.1 从从HTMLHTML到到XHTMLXHTML2.1.4 2.1.4 声明文档类型声明文档类型•DOCTYPE声明必须放在每一个XHTML文档的顶部,在所有代码和标记之前其格式为: DTD-url> •XHTML 1.0提供了三种DTD声明可供选择,这三种DTD的名称分别是 :−①过渡的(过渡的(TransitionalTransitional)) :"-//W3C//DTD XHTML 1.0 Transitional//EN"−②严格的(严格的(StrictStrict)) :"-//W3C//DTD XHTML 1.0 Strict//EN"−③框架的(框架的(FramesetFrameset)) :"-//W3C//DTD XHTML 1.0 Frameset//EN"指定DTD的根元素根元素名称。
在HTML文件中所有的控制标记必须以HTML为根控制标记,所以在DTD声明中elment-name必须是htmlhtml指定DTD是属于标准公用的或是私人制定的,若设为PUBLIC,则表示该DTD是标准公用的,若设为SYSTEM,则表示是私人制定的指定DTD的文件名称其中的DTD叫做文档类型定义,里面包含了文档的规则chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室2.1 2.1 从从HTMLHTML到到XHTMLXHTML2.1.5 XHTML2.1.5 XHTML文档根标记与声明命名空间文档根标记与声明命名空间 • •((1 1))XHTMLXHTML文档根标记文档根标记• •((2 2)声明命名空间)声明命名空间− −xmlsxmls是是XHTML namespaceXHTML namespace的缩写,叫做的缩写,叫做“ “命名空间命名空间” ”声明− −XMLXML允许设计者定义自己的标记,避免同一标记多人定义的混淆允许设计者定义自己的标记,避免同一标记多人定义的混淆发生,发生,XMLXML采用声明命名空间,以通过不同的网址指向来识别。
采用声明命名空间,以通过不同的网址指向来识别 − −因为因为XHTML1.0XHTML1.0不能自定义标记,所以它的命名空间都相同不能自定义标记,所以它的命名空间都相同,就是 文档的内容文档的内容chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室2.1 2.1 从从HTMLHTML到到XHTMLXHTML2.1.6 XHTML2.1.6 XHTML的文档头和文档主体的文档头和文档主体 • •((1 1)文档头和文档标题标记)文档头和文档标题标记• •((2 2)文档主体标记)文档主体标记
常规编辑chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室2.1 2.1 从从HTMLHTML到到XHTMLXHTML2.2.1 2.2.1 注释标记注释标记•浏览器会忽略注释标记中的文字而不作显示,注释标记的使用目的是为文中的不同部分加以说明,以方便以后的阅读和修改,注释标记的格式为-->•结束标记与开始标记可以不在一行上,长度不受限制chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室1.1 1.1 从从HTMLHTML到到XHTMLXHTML2.2.2 2.2.2 段落和换行标记段落和换行标记•段落:−段落标记放在一个段落的头尾,用于定义一个段落段落标记除了具有标识段落的作用外,还能使本段的前后多一个空行,以区别不同段落− 格式:文字文字•换行标记:−由于浏览器会忽略XHTML文档中由
标记。
−强制换行标记的格式为:文字文字
−使用
分隔的内容之间是换行不换段, chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室1.1 1.1 从从HTMLHTML到到XHTMLXHTML2.2.2 2.2.2 段落和换行标记段落和换行标记•段落的属性:−标记有一个属性align, 用来设置段落文字在网页上的对齐方式−left(左对齐)、center(居中)、或right(右对齐)默认为leftchap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室1.1 1.1 从从HTMLHTML到到XHTMLXHTML2.2.3 2.2.3 标题标记标题标记
•标题文字标记的基本格式为:
基本格式为
•常见属性 :属属 性性用用 途途alignalign设置水平线的对齐方式,可选值为:设置水平线的对齐方式,可选值为:left、、center(默认)、(默认)、rightwidthwidth设置水平线的宽度,单位为像素或所在对象大小的百分比,设置水平线的宽度,单位为像素或所在对象大小的百分比,默认值为默认值为100%sizesize设置水平线的粗细,以像素为单位,默认为设置水平线的粗细,以像素为单位,默认为2 colorcolor设置水平线的颜色,由设置水平线的颜色,由IE引进,引进,W3C未规定该属性未规定该属性noshadenoshade删除水平线的阴影删除水平线的阴影chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室1.1 1.1 从从HTMLHTML到到XHTMLXHTML• •2.2.6 2.2.6 文本格式及字体标记文本格式及字体标记•(1)特定文字样式标标 记记用用 法法将文本显示为粗体将文本显示为粗体将文本显示为斜体将文本显示为斜体为文本添加下划线,尽量避免使用,易与链接混淆为文本添加下划线,尽量避免使用,易与链接混淆
字体标记的格式为">被设置的文字被设置的文字
−size用来设置文字的大小取值范围从1~7,取1时最小,7最大−face用来设置字体当字体为汉字时,属性face中的“字体名”可以是Word中的“字体”工具栏中显示的字体名−color用来设置文字颜色颜色可以用相应英文单词或以“#”引导的一个十六进制代码来表示chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础部分颜色说明black | 黑色 | Red | 红色 Line | 石灰色 | Maroon | 栗色 Gray | 灰色 | Silver | 银白色 Navy | 海军蓝 | Olive | 橄榄绿 Purple | 紫色 | Yellow | 黄色 Aqua | 浅绿色 | Blue | 蓝色 Green | 绿色 | Fuchsia | 紫红色 White | 白色 | Teal | 暗蓝绿chap02 XHMTL语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室第第2章章 XHMTL语言基础语言基础东方学院信息分院电子商务教研室东方学院信息分院电子商务教研室2.1 2.1 从从HTMLHTML到到XHTMLXHTML• •2.2.7 2.2.7 滚动字幕滚动字幕•滚动字幕的基本格式为