《预备知识:HTML网页设计基础.ppt》由会员分享,可在线阅读,更多相关《预备知识:HTML网页设计基础.ppt(33页珍藏版)》请在三一办公上搜索。
1、HTML网页设计基础,1 认识和使用HTML2 HTML常用标记3 HTML表单标记4 用 FrontPage设计HTML,1 认识和使用HTML,1.1 什么是HTMLHTML使用各种不同的标记符号来分别标识和设定不同的网页元素。每一个网页元素通常由开始标记、结束标记,以及夹在这两个标记中的内容所组成。一个HTML元素的形式可表示为:内容,说明:,也可以在之间使用标记;不区分大小写;连续的空格、Tab键只当成一个空格;可以使用注释;Html文档中的错误会跳过不予理会;各元素可以嵌套不可以交错。,需要区分大小写吗?整个Html文件可以在一行中书写吗?一个标识可以在多行中书写吗?属性之间有次序要
2、求吗?,1.2 HTML文档基本架构网页标题这是正文部分!,1.3 创建一个简单的HTML文档,图 创建一个简单HTML文档,图 执行结果,2 HTML常用标记,2.1 段落标记1标题标记格式:标题文字,说明:标记符用于定义段落标题的大小级数。最大是,最小。align属性可控制文字的对齐方式,值可以是left,center,或者right。,h1,h6,2.1 段落类标记,2分段标记格式:文字,说明:标记符用于划分段落。是成对标记符,用于定义内容从新的一行开始,并与上段之间有一个空行。,3换行标记格式:文字,说明:标记符用于定义从新的一行显示,它不产生一个空行,但连续多个标记可以产生多个空行的
3、效果。标记符是非成对标记符。,4横线标记格式:说明:hr标记为非成对标记。,2.2 文字格式标记1字体标记格式:文字,2空格用“”表示。,(1)face属性:定义字体,如face=“隶书”。(2)size属性:定义大小,属性值为17,也可以使用相对大小来设置,如size=“+5”、size=“-5”。(3)color属性。定义颜色,可用英文来表示,如:color=“red”;也可使用16进制的RGB来表示,color=“#FF0000”。此外,字体标记符还包括粗体标记符、斜体标记符等。,2.3 列表标记1无序列表标记格式:列表项1列表项2列表项n说明:disk(默认)、square、circl
4、e,花语各种花所代表的含义如下:玫瑰:纯洁的爱 剑兰:用心坚固 满天星:爱怜 紫罗兰:永恒之美 勿忘我:爱到永远,2有序列表标记格式:列表项1列表项2列表项n说明:type的值为:1、a、A、i、I。,2.4 表格标记格式:文字文字d11d12d21d22,2 HTML常用标记,2.5 超链接标记格式:用作超链接的文字或图像,2 HTML常用标记,标记符是成对标记符,主要属性有:(1)href。链接文件的地址。(2)target。链接目标的位置。1.指向电子邮件的链接 与我联系 2.指向站内文件的链接 花节3.指向其他网址的链接 友情链接,2.6 图像标记格式:非成对。HTML 和 XHTML
5、 标准指定了 5 种图像对齐属性值:left、right、top、middle 和 bottom。Netscape 又增加了 4 种垂直对齐属性:texttop、absmiddle、baseline 和 absbottom,Internet Explorer 则增加了 center。注意:不同的浏览器以及同一浏览器的不同版本对 align 属性的某些值的处理方式是不同的。注意:HTML 4.01 不推荐使用 align 属性,XHTML 1.0 Strict DTD 不支持该属性,同时 HTML 5 也不再支持该属性。,2 HTML常用标记,3 HTML表单标记,3.1 表单定义格式 格式:,
6、表单的制作及注意事项:Method属性:指定表单中信息传送给Web应用程序时所采用的方式。Get:把信息作为字符串附加在URL后面。此方式传送信息量小,且以明文显示,保密性差。Post:把表单中的所有信息进行包装后再传送,不受长度限制,且以密文显示,保密性好。,表单的制作及注意事项:Action属性:指明表单提交后将激活的处理程序。action属性值:提交后将数据写入E-mail:提交后交数据写入某ASP文件,3.2 常用表单域标记1标记格式:,1.文本框:2.密码框:3.复选框:4.单选按钮:5.按钮,2标记格式:文字 文字,3标记格式:,同一表单中所有字段的名称必须以英文命名且不得重复,这个名称将用于后端处理。,3.3 表单制作举例,图 表单范例执行结果,3.4 用 FrontPage设计HTML,3.4.1 FrontPage工作窗口1普通方式2HTML方式3预览方式,3.4.2 网页制作基础1利用模板创建网页2网页内容的输入 3网页内容的修饰4设置编号与项目符号5插入图片6设置网页属性,3.4.3 插入表格3.4.4 设置超级链接3.4.5 表单网页制作1表单的插入2插入各种表单域3设置表单属性,