php课件1.ppt
主要内容主要内容1.1 HTML语言简介11.2 HTML语言中的标记码21.3 Dreamweaver CS4的使用321.1 HTML语言简介语言简介HTML语言是超文本标记语言（HyperText Markup Language）的缩写，它是Web上的专用表述语言，是SGML（Standard Generalized Markup Language）的一个简化版本。HTML语言的源文件是纯文本文件，所以，可以使用任何文本编辑器进行编辑，例如UNIX的vi,DOS的edit，Windows中的记事本等。31.2 HTML语言中的标记码语言中的标记码1标记码格式要求（1）任何标记皆由“”及“”所围住，如。（2）标记名与小于号之间不能留有空白字符。（3）某些标记需要加上参数，某些则不必。例如：font 标记码中color参数用来设置目标对象的颜色。代码：设置文本文字的颜色属性（4）参数只可加于起始标记中。（5）在起始标记之标记名前加上符号“”便是其终结标记，如（6）标记字母不区分大小写。41.2 HTML语言中的标记码语言中的标记码2标记码分类及基本结构标记码按形态分为围堵标记与空标记：（1）围堵标记 也称为双标记或双标签，顾名思义，它以起始标记及终结标记将文字围住，令其达到预期显示效果。即必须成对出现。这类标记的语法是：内容例如HTML 代码：加粗显示文字不加粗显示文字 51.2 HTML语言中的标记码语言中的标记码（2）空标记 也称为单标记或单标签，因为它只需要单独使用就能完整的表达意思。即只有起始标记没有终结标记。这类标记的语法是：例如HTML 代码：你喜欢网页制作吗？喜欢 61.2 HTML语言中的标记码语言中的标记码（3）属性大部分标记码的起始标记内可以包含一些属性，其语法是：你喜欢网页制作吗？71.2 HTML语言中的标记码语言中的标记码HTML文档分文档头和文档体两大部分。文档头对文档进行了一些必要的定义，文档体中显示文档主体的各种信息，所有网页都是在这种架构的基础上逐步润色而形成的。81.2 HTML语言中的标记码语言中的标记码 文字的链接 91.2 HTML语言中的标记码语言中的标记码text：指定HTML文件中文字颜色属性。link：指定HTML文件中待连接超连接对象颜色属性。alink：指定HTML文件中连接中超连接对象颜色属性。vlink：指定HTML文件中已连接超连接对象颜色属性。background：指定HTML背景图形。bgcolor：指定HTML背景颜色属性。以下的三个参数只在浏览器中起作用：leftmargin：指定整份文件显示画面的左方边沿空间，单位为像素。topmargin：指定整份文件显示画面的上方边沿空间，单位为像素。bgproperties：指定背景图形是否具有卷动属性。101.2 HTML语言中的标记码语言中的标记码排版标记包括：、。它们都起到安排网页内容所处位置的作用。11（1）增强程序可读性。为文中不同部分加上说明，方便日后维护及修改。例如：称为段落标记，其作用是为文字、图片、表格等之间留一空白行。可以省略，下一个的开始标记着上一个的结束。1.2 HTML语言中的标记码语言中的标记码12源代码：设置文本的对齐方式文字右对齐文字左对齐文字居中对齐1.2 HTML语言中的标记码语言中的标记码13 称为换行标记，其作用是令文字、图片、表格等对象显示于下一行。【例1.3】换行示例。源代码 换行示例 相见时难别亦难，东风无力百花残。春蚕到死丝方尽，蜡炬成灰泪始干。相见时难别亦难，东风无力百花残。春蚕到死丝方尽，蜡炬成灰泪始干。1.2 HTML语言中的标记码语言中的标记码14 称为水平线，其作用使HTML文件插入一条水平线，用以分割不同的部分。用代码标记水平线。它可以添加的参数如下所示。（1）对齐方式align设定线条置放位置，可选择left、center、right三种设定值。（2）宽度size设定线条宽度，以像素作单位，缺省值为2像素。（3）长度width设定线条长度，可以是绝对值（以像素作单位）或相对值，缺省值为100%。（4）颜色color设定线条颜色，缺省值为黑色。（该参数只在浏览器中起作用）。（5）无阴影noshade设定线条为平面显示即无阴影显示，若删去则具有阴影或立体，这是缺省值。1.2 HTML语言中的标记码语言中的标记码15【例1.4】水平线示例。部分源代码：1.2 HTML语言中的标记码语言中的标记码165居中标记n称为居中标记，其作用是令文字、图片、表格等对象居中显示。【例1.5】center属性示例。部分源代码：文字居中对齐文字居中对齐文字居中对齐1.2 HTML语言中的标记码语言中的标记码171.2.4 文字的字体与样式标记n1是应用在文件的内文部分，即与之间的位置，只影响所标示的文字，是一个围堵标记。的语法为：的语法为：属性参数含义：nface：设定文字的字体。face属性可以将文本对象设置成计算机中存在的各种字体。nsize：设定文字的大小，其值可以是绝对值或相对值。该属性的有效范围为1-7，其中缺省值为3，可以在size属性值之前加上“+”、“-”字符，来指定相对于字号初始值的增量或减量。1.2 HTML语言中的标记码语言中的标记码18【例1.8】font属性示例。源代码：设置字体字号颜色示例 宋体文字 黑体文字华文琥珀文字华文琥珀文字1.2 HTML语言中的标记码语言中的标记码192文字字形样式【例1.9】设置字形示例。源代码：设置字形示例粗体文字 加下划线文字 大型文字 小型文字强调文字特别强调文字 删除线文字1.2 HTML语言中的标记码语言中的标记码204.标题【例1.10】设置字形示例。源代码：设置标题示例标题1 标题2 标题4 标题5标题6 1.2 HTML语言中的标记码语言中的标记码211.2.5 列表元素标记 列表元素标记主要包括以下几种标记：有序列表标记、无序列表标记和列表项标记。1有序列表标记 所谓有序列表标记，就是在每一项前面加上1，2，3等数目，又称编号清单。n 的常用格式：2无序列表标记 所谓无序列表标记，就是在每一项前面加上实心圆、空心圆、实心方格等符号，故又称符号清单。n 的常用格式：1.2 HTML语言中的标记码语言中的标记码22n【例1.11】列表元素示例。n源代码：1.2 HTML语言中的标记码语言中的标记码231.2.6 表格标记1.表格的三个基本要素 表格、表行、表单元格这三个标记是定义表格的最重要的标记，可以说只学这三个以足够处理简单的表格。（1）表格是一个容器标记，意思是说它用以宣告这是表格而且其它表格标记只能在他的范围内才适用。（2）表行用以标示表格行(row)，每一对可以为表格创建一个行。（3）表单元格用以标示单元格(cell)，用创建一个行之后，还需要使用为行创建单元格。1.2 HTML语言中的标记码语言中的标记码24n【例1.12】建立简单表格示例。1.2 HTML语言中的标记码语言中的标记码25【例1.13】表格属性示例。源代码：表格table标记属性示例 公司名先尧文化公司地址哈尔滨江北利民开发区师大南路邮编150025联系人马先尧传真0451-8000000 1.2 HTML语言中的标记码语言中的标记码261.2.7 表单标记 表单标记：、等。其中input有以下几种类型：text,radio,checkbox,password,submit/reset,image,file,hidden,button。1表单标记 n称为表单标记，用以宣告此为表单模式，属于一个容器标记，表示其它表单标记需要在它的包围中才有效。n的常用参数设定：272单行文本框 n文本框是一种让访问者自己输入内容的表单对象，通常被用来填写单个文字或者简短的回答，如登陆帐号、密码等。n的常用参数设定：1.2 HTML语言中的标记码语言中的标记码28【例1.15】表单元素单行文本框示例。源代码：表单元素单行文本框示例登陆帐户：登陆密码：验 证 码：1.2 HTML语言中的标记码语言中的标记码29单选按钮n单选按钮是指只能选择其中一项的选项框，在许多情况中，选择只能是其中的一项，例如人的“性别”选项一样，要么是男，要么是女。n的主要参数设定：n男 n女 n代码显示结果为：性别：男 女1.2 HTML语言中的标记码语言中的标记码305复选框的主要参数设定：参数含义：复选框的参数name、value、checked参考text部分的说明。6提交按钮及清除按钮这是表单上重要的两个按键，两者所附带的参数相同。提交按钮及清除按钮的主要参数设定：（1）设定输入方式为：submit或Reset（2）值value1.2 HTML语言中的标记码语言中的标记码311.3 Dreamweaver CS4的使用1.3.1 Dreamweaver CS4简介1.3.2 Dreamweaver CS4使用n1.站点定义n2.Web页面制作3233
