网页设计第9章.ppt

网页设计三合一教程 主讲教师 第9章 用HTML编写网页 主讲教师 9.1　初识HTML 1．HTML语言简介 2．HTML文件基本架构 1．HTML语言简介 HTML 超文本标识语言HTML是一种建立网页文件的语言，通过对各种标记式的指令、元素、属性、对象等的定义，将影像、声音、图片、文字等连接显示出来。 HTML标记 由 和 所括住的指令，主要分为单标记指令、双标记指令（由 起始标记 和 / 结束标记 所构成 ) 。 1．HTML语言简介 HTML语言的三种形式 标记，非封闭的类型。很少用，最常用的如换行标记br。 标记对象/标记，封闭类型。大多数标记都是封闭类型的。封闭类型的标记都是成对出现。 标记属性1=参数1 标记属性2=参数2对象/标记，封闭类型的扩展形式，后面的各种属性参数可以进一步设置对象在某方面的内容。 说明 几乎所有的HTML代码都是由上面三种形式组合而成的，标记之间可以相互嵌套，形成更为复杂的语法。 1．HTML语言简介 HTML文件组成 一个完整的HTML文件由head和body两部分组成。 head部分 包含标题、网页语言等基本信息，还可包含作者信息、网页关键字、网页说明等； body部分 其中的内容是网页显示的主要内容，由表格、图片、表单等各种对象组成。 1．HTML语言简介 说明一 可以使用任何文本编辑器打开、浏览、编辑HTML代码，最简单的是Windows自带的记事本。 说明二 HTML文件编辑完成后以.htm或.html为文件后缀保存，可由浏览器打开显示。 说明三 习惯上一个网站的首页名称通常为index.htm或index.html。 1．编写第一个网页 使用记事本编写第一个网页，步骤如下： 选择【开始】/【所有程序】/【附件】/【记事本】”命令，打开记事本程序。 在记事本中输入HTML代码。 保存文件，在保存类型中选择【所有文件】，在编码中选择ANSI，文件名设为“myfirst.htm”。 关闭记事本，回到存盘的文件夹，双击myfirst.htm文件，在Internert Explore浏览器中浏览页面。 第一个网页的代码及页面效果 html head title初识HTML语言/title meta http-equiv=Content-Type content=text/html; charset=gb2312 /head body p我的第一个HTML文件/p /body /html 2．注意事项 “”、“”是任何标记的开始和结束。 标记与标记之间可以嵌套。 在源代码中不区分大小写。 任何换行和空格在源代码里面不起作用。 HTML标记中可以放置各种属性。 可以在源代码中添加注释，注释以“!--”开始，以“--”结束。 9.3　添加各种网页元素 9.3.1　向页面中添加文字 9.3.2　设置页面中的标题 9.3.3　设置页面的背景颜色和背景图片 9.3.4　在页面中插入图片 9.3.5　设置文字和图片链接 9.3.6　给网页加上声音 9.3.1　向页面中添加文字 （1）将需要添加的文字输入到body与/body标识之间。 （2）pre/pre是“原样显示文本”的标识。 （3）br称为行中断标识。 标识后面的内容另起一行显示。 （4）段落标识p/p分别放在段首和段尾。 p/p比br多一行空行，也就是空一行，再另起一行显示文本内容。 9.3.1　向页面中添加文字 （5）font/font是字体标识，对标识中的文本字体起控制作用，有“size”和 “color两个属性： “size” 表示字体的大小。“color表示字体的颜色。 （6）在文字前后加上b/b标识，可以使文字加粗显示。 b/b为粗体显示标识； i/i为斜体显示标识； u/u为带下划线显示标识。 （7）center与/center是居中显示标识。 应用上述标识后的完整程序 html head title/title meta http-equiv=Content-Type content=text/html; charset=gb2312 /head body centerfont size=6 color=redb西红柿/b/fontbr/center [名称]西红柿br [性味]味酸甘、性微寒。br [归经]入心、肺、胃经。br [作用]润肺生津、和胃止渴。用于暑热烦渴、咽干、恶心欲吐、厌食、大便秘结、小便黄赤等。br [成分]含大量维生素C、A、B1、B2、及磷、铁、钙等，还含有较多的苹果酸、柠檬酸等有机酸。现代医学研究证实，它有抗衰老、降压、褪色素的作用。br /body /html 9.3.2　设置页面中的标题 在title/title标识中输入网页的标题文字，并进行相应的设置。 说明 在Dreamw