计算机基础知识课件

计算机基础及网页设计计算机教研室计算机教研室计计算机基算机基础础及网及网页设计计页设计计算机教研室算机教研室第一章第一章 计算机基础知识计算机基础知识v1.1 计算机概述计算机概述v1.2 中文中文Windows2000操作系统操作系统v1.4 计算机网络基础计算机网络基础第一章第一章 计计算机基算机基础础知知识识1.1 计计算机概述算机概述1.1 计算机概述计算机概述v1.1.1 计算机的发展计算机的发展v1.1.2 计算机信息编码形式计算机信息编码形式v1.1.3 计算机硬件系统组成计算机硬件系统组成v1.1.4 计算机软件系统组成计算机软件系统组成1.1 计计算机概述算机概述1.1.1 计计算机的算机的发发展展1.1.1 计算机的发展计算机的发展一、计算机的产生一、计算机的产生 世界上第一台电子数字积分计算机：世界上第一台电子数字积分计算机：名称名称：埃尼阿克埃尼阿克ENIAC (Electronic Numerical Integrator and Computer)时间时间：1946年年2月月 地点地点：美国美国宾夕法尼亚大学宾夕法尼亚大学1.1.1 计计算机的算机的发发展一、展一、计计算机的算机的产产生生第一台计算机图片：第一台计算机图片：第一台第一台计计算机算机图图片：片：第一台计算机图片：第一台计算机图片：第一台第一台计计算机算机图图片：片：1.1.1 1.1.1 计算机的发展计算机的发展v计算机发展历经四代计算机发展历经四代 ：第一代（第一代（1946-19581946-1958）电子管电子管计算机计算机第二代（第二代（1958-19641958-1964）晶体管晶体管计算机计算机第三代（第三代（1964-19701964-1970）集成电路集成电路（ICIC）计算机）计算机第四代（第四代（1971-1971-至今）至今）大规模集成电路大规模集成电路计算机计算机1.1.1 计计算机的算机的发发展展计计算机算机发发展展历经历经四代四代：电子管电子管 vacuum tube1、真空的，体积庞大、真空的，体积庞大2、使用寿命短、使用寿命短电电子管子管 vacuum tube1、真空的，体、真空的，体积庞积庞大大1.1.2 计算机的编码形式计算机的编码形式采用二进制码的原因：采用二进制码的原因：1、物理上容易实现、物理上容易实现2、编码、计数、加减运算规则简单、编码、计数、加减运算规则简单3、为了书写和表示方便，引进八进、为了书写和表示方便，引进八进 制和十六进制制和十六进制1.1.2 计计算机的算机的编码编码形式采用二形式采用二进进制制码码的原因：的原因：二进制计数特点二进制计数特点1 1、只有两个基数：、只有两个基数：0 0和和1 12 2、逢、逢“二二”进一进一二二进进制制计计数特点数特点1、只有两个基数：、只有两个基数：0和和1二进制计数运算规则二进制计数运算规则v加法：0+0=00+0=00+1=10+1=11+0=11+0=11+1=101+1=10v减法：0-0=00-0=01-0=11-0=11-1=01-1=010-1=110-1=1二二进进制制计计数运算数运算规则规则加法：加法：0+0=0减法：减法：0-0=0二进制计数运算规则二进制计数运算规则v乘法：v除法：0 00=00=00 01=11=11 10=10=11 11=11=1商数非商数非0 0即即1 1二二进进制制计计数运算数运算规则规则乘法：除法：乘法：除法：00=0商数非商数非0即即1四种常用进位计数制四种常用进位计数制计数计数 制制基数基数数码数码进位规则进位规则十进制100 1 2 3 4 5 6 7 8 9逢十进一逢十进一二进制20 1逢二进一逢二进一八进制80 1 2 3 4 5 6 7逢八进一逢八进一十六进制160 1 2 3 4 5 6 78 9 A B C D E F逢十六进一逢十六进一四种常用四种常用进进位位计计数制数制计计数数 制基数数制基数数码进码进位位规则规则十十进进制制100 1 二进制、八进制、十六进制对照二进制、八进制、十六进制对照 二 八 二 十六 二 十六000 0001 1010 2 011 3100 4101 5110 6111 70000 00001 10010 20011 30100 40101 50110 60111 71000 81001 91010 A1011 B1100 C1101 D1110 E1111 F二二进进制、八制、八进进制、十六制、十六进进制制对对照照 二二 八八 1.4 计算机网络基础计算机网络基础网络：网络：将分布在不同地理位置且具有独立将分布在不同地理位置且具有独立功能的计算机及辅助设备，通过通信设备功能的计算机及辅助设备，通过通信设备和传输线路连接起来，由功能完善的网络和传输线路连接起来，由功能完善的网络软件（网络协议、信息交换方式、控制程软件（网络协议、信息交换方式、控制程序和网络操作系统）序和网络操作系统）实现网络资源共享实现网络资源共享的的系统称为计算机网络系统。系统称为计算机网络系统。1.4 计计算机网算机网络络基基础础网网络络：将分布在不同地理位置且具有独立：将分布在不同地理位置且具有独立计算机网络的发展计算机网络的发展1）面向终端的计算机通信网络）面向终端的计算机通信网络 2）以共享资源为目标的计算机网络）以共享资源为目标的计算机网络 3）标准化网络）标准化网络 开放系统互联参考模型开放系统互联参考模型 OSI/RM4）因特网）因特网 计计算机网算机网络络的的发发展展1）面向）面向终终端的端的计计算机通信网算机通信网络络 Internet资源与典型服务资源与典型服务v特殊特殊IP地址地址1）回送地址）回送地址 127.0.0.1 127.0.0.1为本地回送地址，用于测试本机安装为本地回送地址，用于测试本机安装 协议的正确性。协议的正确性。2）直接广播地址）直接广播地址 3）有线广播地址）有线广播地址 4）全）全“0”地址地址 5）“0”地址地址 Internet资资源与典型服源与典型服务务特殊特殊IP地址地址域名域名v域名：主机的名字。域名：主机的名字。v域名域名结构：主机名机构名次高域名最高域名构：主机名机构名次高域名最高域名 v注意：计算机处理的还是注意：计算机处理的还是IPIP地址地址。因此，在。因此，在InternetInternet上上需要有一个完成需要有一个完成IPIP地址和域名的转换地址和域名的转换的设备、这个设备的设备、这个设备就是就是域名服务器（域名服务器（DNSDNS）。域名域名：主机的名字。域名域名：主机的名字。统一资源定位标识统一资源定位标识 v统一资源定位标识（统一资源定位标识（Uniform Resource LocatorUniform Resource Locator，URLURL）为了引用了引用资源，在源，在WWWWWW上，每一信息上，每一信息资源都有源都有统一且唯一一且唯一的地址，的地址，该地址称地址称为URLURL。vURLURL基本格式：基本格式：/httphttp:/:/ 统统一一资资源定位源定位标识标识 统统一一资资源定位源定位标识标识（Uniform ResoIPv6简介简介vIPv4IPv4局限性及其缺点局限性及其缺点 1 1）地址空地址空间的局限性的局限性2 2）安全性）安全性问题3 3）结点配置比点配置比较复复杂vIPv6IPv6对IPv4IPv4的改的改进 1 1）扩展地址展地址 2 2）其他方面）其他方面 IPv6简简介介IPv4局限性及其缺点局限性及其缺点 第三章第三章 HTML简介简介HTML：超文本标记语言超文本标记语言，它采用，它采用HTML标记来标注标记来标注 文本、图像、链接等网页元素，形成网页文本、图像、链接等网页元素，形成网页。编辑环境编辑环境 ：文本文档（如：文本文档（如Windows记事本）、记事本）、FrontPage、Dreamweaver 等等 第三章第三章 HTML简简介介HTML：超文本：超文本标记语标记语言，它采用言，它采用HT第三章第三章 HTML简介简介HTML：超文本标记语言超文本标记语言，它采用，它采用HTML标记来标注标记来标注 文本、图像、链接等网页元素，形成网页文本、图像、链接等网页元素，形成网页。编辑环境编辑环境 ：文本文档（如：文本文档（如Windows记事本）、记事本）、FrontPage、Dreamweaver 等等 第三章第三章 HTML简简介介HTML：超文本：超文本标记语标记语言，它采用言，它采用HT3.1.1 接触接触HTML3.1.1 接触接触HTML3.1.2 HTML相关概念相关概念一、标记一、标记 标记是标记是HTML用于描述功能的符号，它用来标识用于描述功能的符号，它用来标识文档的结构文档的结构以及以及链接信息链接信息。标记在使用时，要用。标记在使用时，要用括起来括起来。二、标记的分类二、标记的分类 1单标记：只需单独使用就能完整表达意思的标记。单标记：只需单独使用就能完整表达意思的标记。格式：格式：例如：例如：3.1.2 HTML相关概念一、相关概念一、标记标记二、二、标记标记的分的分类类 3.1.2 HTML相关概念相关概念2双标记：必须首标记与尾标记成对出现才能完整表双标记：必须首标记与尾标记成对出现才能完整表 达意思的标记。达意思的标记。格式：格式：内容内容说明：说明：“内容内容”指要被这对标记施加作用的部分。指要被这对标记施加作用的部分。例如：例如：1)渭城曲渭城曲2)渭城朝雨渭城朝雨浥轻尘浥轻尘3.1.2 HTML相关概念相关概念2双双标记标记：必：必须须首首标记标记与尾与尾标记标记3.1.2 HTML相关概念相关概念三、标记的使用格式三、标记的使用格式格式：格式：属性语法：属性名属性语法：属性名=“属性值属性值”(英文状态英文状态)例如：例如：1、2、渭城渭城 朝雨浥轻尘朝雨浥轻尘3.1.2 HTML相关概念三、相关概念三、标记标记的使用格式的使用格式 文件头内容文件头内容 文件体内容文件体内容 3.1.3 HTML文档结构和语法规则文档结构和语法规则一、一、HTML文档结构文档结构HTML文件开始文件开始HTML文件结束文件结束文件头开始文件头开始文件头结束文件头结束文件体开始文件体开始文件体结束文件体结束3.1.3 HTML文档文档结结构和构和语语法法规则规则一、一、HT1.HTML文件以文件以纯文本纯文本形式存放，扩展名为形式存放，扩展名为“.htm”或或“.html”。2.HTML标记标记不区分大小写不区分大小写。3.多数多数HTML标记标记可以嵌套可以嵌套，但，但不可以交叉不可以交叉。4.可以在可以在一行写多个标记一行写多个标记，也可以将，也可以将一个标记分多行书一个标记分多行书 写写而不用任何续行符号。而不用任何续行符号。3.1.3 HTML文档结构和语法规则文档结构和语法规则二、二、HTML语法规则语法规则1.HTML文件以文件以纯纯文本形式存放，文本形式存放，扩扩展名展名为为“.htm”3.3.1.3 HTML文档结构和语法规则文档结构和语法规则5.HTML源文件中的换行、回车符和多个连续空格是源文件中的换行、回车符和多个连续空格是 无效的。无效的。应使用应使用实现换行实现换行；使用使用实现换段实现换段；需要需要多个连续空格时，可使用多个多个连续空格时，可使用多个 转义符号或转义符号或 全角空格全角空格。v 换段和换行的区别：换段比换行的行距要大。换段和换行的区别：换段比换行的行距要大。3.1.3 HTML文档文档结结构和构和语语法法规则规则5.HTML源文件源文件3.1.3 HTML文档结构和语法规则文档结构和语法规则6.网页中的网页中的所有显示内容都应该受限于一个或多个标所有显示内容都应该受限于一个或多个标 记记，不应有游离于标记之外的网页元素，以免产生，不应有游离于标记之外的网页元素，以免产生 错误。错误。三、进行HTML文档编辑说明 1.要修改网页文件的要修改网页文件的HTML源代码，可在源代码，可在记事本记事本窗口中窗口中 打开，也可打开，也可将网页图标拖到将网页图标拖到“记事本记事本”图标上图标上。2.浏览网页时，要查看和编辑源代码，可在窗口的浏览网页时，要查看和编辑源代码，可在窗口的“查看查看”菜单下选菜单下选“源文件源文件”。3.本章的实例网页要求保存到同一个文件夹中。本章的实例网页要求保存到同一个文件夹中。3.1.3 HTML文档文档结结构和构和语语法法规则规则6.网网页页中的所有中的所有显显3.2 HTML常用标记常用标记 HTML标记标记网页结构标记网页结构标记文本格式标记文本格式标记表格标记表格标记图像与多媒体标记图像与多媒体标记超链接标记超链接标记表单标记表单标记框架标记框架标记3.2 HTML常用常用标记标记 HTML标记标记网网页结页结构构标记标记文本格式文本格式3.2.1 网页结构标记网页结构标记一、一、HTML文件标记（文件标记（HTML）作用：作用：用来标注用来标注HTML文档。文档。HTML的其它所有标记放的其它所有标记放 在在和和之间。之间。二、文件头部标记（二、文件头部标记（HEAD）作用：作用：用来定义文件的一些有关信息。用来定义文件的一些有关信息。以以和和 作首尾标记。在其中可以包括：作首尾标记。在其中可以包括：1TITLE：用来设定显示在浏览器标题栏的网页标题：用来设定显示在浏览器标题栏的网页标题格式：格式：标题文字标题文字3.2.1 网网页结页结构构标记标记一、一、HTML文件文件标记标记（HTML）3.2.1 网页结构标记网页结构标记例如：例如：渭城曲渭城曲2Meta：用来设定文档说明性信息等。：用来设定文档说明性信息等。例如：例如：三、文件主体标记（三、文件主体标记（BODY）作用：用来作用：用来标识文档的主体内容标识文档的主体内容。以。以和和 作首尾标记，网页正文中的所有作首尾标记，网页正文中的所有 内容（如文字、图像等）都包含其中。内容（如文字、图像等）都包含其中。3.2.1 网网页结页结构构标记标记例如：例如：渭城曲渭城曲/3.2.1 网页结构标记网页结构标记格式：格式：3.2.1 网网页结页结构构标记标记格式：格式：3.2.1 网页结构标记网页结构标记颜色值的表示方法为：颜色值的表示方法为：#RGB或或颜色名颜色名。v#RGB：代表颜色中：代表颜色中红绿蓝红绿蓝三种颜色各占的份额。三种颜色各占的份额。各颜色值分别为各颜色值分别为2位十六进制码，最小值为位十六进制码，最小值为00，最大，最大值为值为FF。（如：。（如：bgcolor=#FF8000）v颜色名颜色名：系统规定的颜色名，多为：系统规定的颜色名，多为颜色的英文名称颜色的英文名称，（如：（如：alink=red）四、注释标记（！）四、注释标记（！）作用：在代码编写时提供说明性信息，但浏览时不显示。作用：在代码编写时提供说明性信息，但浏览时不显示。格式：格式：3.2.1 网网页结页结构构标记标记颜颜色色值值的表示方法的表示方法为为：#RGB3.2.2 文本格式标记文本格式标记v文本格式标记，用来对网页中文本格式标记，用来对网页中文本文本的字样、颜色、的字样、颜色、段落格式等进行定义。段落格式等进行定义。v文本格式标记文本格式标记1、标题格式标记（、标题格式标记（Hn）5、强行换行标记（、强行换行标记（BR）2、文字格式标记（、文字格式标记（FONT）7、块标记（、块标记（DIV）3、字型设置标记、字型设置标记 8、插入水平线标记（、插入水平线标记（HR）4、段落标记（、段落标记（P）9、列表标记、列表标记3.2.2 文本格式文本格式标记标记文本格式文本格式标记标记，用来，用来对对网网页页中文本的字中文本的字1、标题格式标记（、标题格式标记（Hn）1、标题标题格式格式标记标记（Hn）1、标题格式标记（、标题格式标记（Hn）v作用：作用：将被标记的文本定义为将被标记的文本定义为某种样式某种样式的标题。的标题。v格式：格式：文字文字v注意：注意：n表示标题级别，为从表示标题级别，为从16的数字。的数字。数字越小，文字越大。数字越小，文字越大。v属性：属性：align表示水平对齐方式。表示水平对齐方式。包括包括LEFT，CENTER，RIGHT。1、标题标题格式格式标记标记（Hn）作用：将被）作用：将被标记标记的文本定的文本定义为义为某种某种样样式的式的2、文字格式标记（、文字格式标记（FONT）v作用：作用：设置普通文本的设置普通文本的字体字体、字号字号、颜色颜色等。等。v格式：格式：文字文字v属性：属性：1、face：字体。默认字体为宋体。：字体。默认字体为宋体。2、size：字号。为：字号。为17间的数字。间的数字。3、color：文字颜色。：文字颜色。2、文字格式、文字格式标记标记（FONT）作用：）作用：设设置普通文本的字体、字号、置普通文本的字体、字号、3、字形设置标记、字形设置标记3、字形、字形设设置置标记标记3、字形设置标记、字形设置标记v作用：作用：设置普通文本的字型，如粗体、斜体、下划线等。设置普通文本的字型，如粗体、斜体、下划线等。v常用字型设置标记有：常用字型设置标记有：1、：粗体（：粗体（bold）2、：斜体（：斜体（italic）3、：下划线（：下划线（underline）4、：强调（：强调（emphasis）5、：增强：增强3、字形、字形设设置置标记标记作用：作用：设设置普通文本的字型，如粗体、斜体、下划置普通文本的字型，如粗体、斜体、下划4、段落标记（、段落标记（P）v作用：作用：设置段落的开始和结束。设置段落的开始和结束。v格式：格式：段落内容段落内容v说明：说明：1、在一个、在一个P标记中加入属性值，其所在段落的标记中加入属性值，其所在段落的所有文本都具有该属性。所有文本都具有该属性。2、P标记可以成对使用，也可以单独使用。单标记可以成对使用，也可以单独使用。单独使用时，从独使用时，从P标记开始处向后的所有内容都标记开始处向后的所有内容都从属于该段。从属于该段。4、段落、段落标记标记（P）作用：）作用：设设置段落的开始和置段落的开始和结结束。束。5、强行换行标记（、强行换行标记（BR）v作用：作用：使文本内容强行换行使文本内容强行换行。v格式：格式：v说明：说明：使用使用换行，行距要比换行，行距要比小。小。5、强强行行换换行行标记标记（BR）作用：使文本内容）作用：使文本内容强强行行换换行行。7、块标记（、块标记（DIV）v作用：作用：定义一个文本块，为块中的内容设置统一定义一个文本块，为块中的内容设置统一 的属性。的属性。v格式：格式：块内容块内容v说明：说明：如果多个段落或表格内容属性相同，则可将如果多个段落或表格内容属性相同，则可将 它们加入到它们加入到DIV标记对中进行统一设置。标记对中进行统一设置。7、块标记块标记（DIV）作用：定）作用：定义义一个文本一个文本块块，为块为块中的内容中的内容设设置置统统8、插入水平线标记（插入水平线标记（HR）v作用：作用：在页面上加入水平线。在页面上加入水平线。v格式：格式：v属性：属性：1、width：长度。值为数字时，表示像素；值为百分：长度。值为数字时，表示像素；值为百分 数时，表示相对百分比。数时，表示相对百分比。2、size：线宽。：线宽。3、noshade：取消阴影。：取消阴影。8、插入水平、插入水平线标记线标记（HR）作用：在作用：在页页面上加入水平面上加入水平线线。9、列表标记、列表标记 无序列表无序列表有序列表有序列表9、列表、列表标记标记 无序列表有序列表无序列表有序列表9、列表标记、列表标记 1无序号列表标记（项目符号，无序号列表标记（项目符号，UL）v作用：作用：对文本段设置无序列表。对文本段设置无序列表。v格式：格式：列表项目列表项目1 列表项目列表项目2 9、列表、列表标记标记 1无序号列表无序号列表标记标记（项项目符号，目符号，UL9、列表标记、列表标记 1无序号列表标记（项目符号，无序号列表标记（项目符号，UL）v属性：属性：type为符号类型，其三种值代表三种不同为符号类型，其三种值代表三种不同 的列表符号。的列表符号。disc-；circle-；square-。9、列表、列表标记标记 1无序号列表无序号列表标记标记（项项目符号，目符号，UL9、列表标记、列表标记 2有序号列表标记（编号，有序号列表标记（编号，OL）v作用：作用：对文本段设置有序列表。对文本段设置有序列表。v格式：格式：列表项目列表项目1 列表项目列表项目2 9、列表、列表标记标记 2有序号列表有序号列表标记标记（编编号，号，OL）9、列表标记、列表标记 2有序号列表标记（编号，有序号列表标记（编号，OL）v属性：属性：1）start：定义编号的起始号码：定义编号的起始号码 2）type：定义编号类型，其不同的值代表不同的：定义编号类型，其不同的值代表不同的 列表编号。其中列表编号。其中“1”代表数字；代表数字；“a”代表小写英代表小写英 文；文；“A”代表大写英文；代表大写英文；“I”代表大写罗马字母；代表大写罗马字母；“i”代表小写罗马字母。代表小写罗马字母。9、列表、列表标记标记 2有序号列表有序号列表标记标记（编编号，号，OL）3.2.3 表格标记表格标记HTMLHTML代码生成表格主要用到代码生成表格主要用到4 4个表格标记：个表格标记：vTABLETABLE：表格；：表格；vTRTR：表行；：表行；vTHTH：表头；：表头；vTDTD：表列。：表列。3.2.3 表格表格标记标记HTML代代码码生成表格主要用到生成表格主要用到4个表格个表格标记标记表格标记格式：表格标记格式：表题表题表头表头1表头表头2表头表头n表格表格标记标记格式：格式：TABLE summary=注注释释文字文字 表格标记格式：表格标记格式：表项表项1表项表项2表项表项n表项表项1表项表项2表项表项n表格表格标记标记格式：格式：3.2.3 表格标记表格标记v属性：属性：1)summary：表格注释。不显示在网页中。：表格注释。不显示在网页中。2)border：表格边框宽度。值为数字，：表格边框宽度。值为数字，0表示无框线；表示无框线；3)bordercolor：边框色。：边框色。4)width：表格宽度。值可以是数字或百分数。数字：表格宽度。值可以是数字或百分数。数字 表示像素点，百分数是相对百分比。表示像素点，百分数是相对百分比。5)height：表格高度。值可以是数字或百分数，用法：表格高度。值可以是数字或百分数，用法 同同width属性。属性。6)align：水平对齐方式。可设置为：水平对齐方式。可设置为“LEFT”、“CENTER”、“RIGHT”；7)valign：垂直对齐方式。可设置为：垂直对齐方式。可设置为“TOP”、“MIDDLE”、“BOTTOM”3.2.3 表格表格标记标记属性：属性：3.2.3 表格标记表格标记v说明：说明：1)表头文字表头文字自动自动加粗且居中。加粗且居中。2)表项内容可以是文字，也可以是图像。表项内容可以是文字，也可以是图像。3)标记对必须放在标记对必须放在对中，对中，或或 标记对必须放在标记对必须放在对中。对中。4)、也可以以也可以以单标记单标记形式出现，其形式出现，其 每项的开始则是上一项的结束。每项的开始则是上一项的结束。5)TD标记中允许包含属性设定，用来设置单元格属性。标记中允许包含属性设定，用来设置单元格属性。6)表格允许嵌套。表格允许嵌套。3.2.3 表格表格标记说标记说明：明：3.2.4 图像与多媒体标记图像与多媒体标记一、图像标记（一、图像标记（IMG）v作用：作用：在当前位置插入图像。在当前位置插入图像。v格式：格式：3.2.4 图图像与多媒体像与多媒体标记标记一、一、图图像像标记标记（IMG）3.2.4 图像与多媒体标记图像与多媒体标记v属性：属性：src：图片所在的路径及文件名。：图片所在的路径及文件名。当带有图片的网页文件和图片在同一文件夹中时，当带有图片的网页文件和图片在同一文件夹中时，可省略路径。路径可分为绝对路径和相对路径。可省略路径。路径可分为绝对路径和相对路径。alt：替代文本。：替代文本。longdesc：图像的详细说明。：图像的详细说明。hspace：水平边距。：水平边距。vspace：垂直边距。：垂直边距。3.2.4 图图像与多媒体像与多媒体标记标记属性：属性：3.2.5 超链接标记（超链接标记（A）v作用：作用：为被标记对象建立超链接。为被标记对象建立超链接。v格式：格式：被标记对象被标记对象v属性：属性：1、href：被链接对象的地址。：被链接对象的地址。2、target：被链接对象在哪个窗口或框架中打开。其：被链接对象在哪个窗口或框架中打开。其 值的情况为：值的情况为：1)_blank：在新窗口打开。：在新窗口打开。3.2.5 超超链链接接标记标记（A）作用：作用：为为被被标记对标记对象建立超象建立超链链接。接。3.2.5 超链接标记（超链接标记（A）2)_parent：在含有该链接位置的父窗口或父框架：在含有该链接位置的父窗口或父框架 中打开。中打开。3)_self：在该链接所在的窗口或框架中打开。：在该链接所在的窗口或框架中打开。4)_top：在整个浏览器窗口打开。：在整个浏览器窗口打开。3.2.5 超超链链接接标记标记（A）2)_parent：在含有：在含有该该3.2.6 表单标记（表单标记（FORM）v表单作用：表单作用：可用来获得用户信息，使网页具有交互功能。可用来获得用户信息，使网页具有交互功能。v表单标记：表单标记：FORM、INPUT、SELECT、TEXTAREA。1）是是表单定义标记表单定义标记。2）后三种是）后三种是表单元素标记表单元素标记，应该加入到，应该加入到 标记对中。标记对中。3.2.6 表表单标记单标记（FORM）表）表单单作用：可用来作用：可用来获获得用得用户户信息信息3.2.6 表单标记（表单标记（FORM）v作用：作用：定义一个表单，供后续设计向其中加入表单对象。定义一个表单，供后续设计向其中加入表单对象。v格式：格式：v属性：属性：1、action：设定处理程序的文件名。：设定处理程序的文件名。2、method：设定处理程序从表单获得信息的方：设定处理程序从表单获得信息的方 式。包括：式。包括：1)POST：当前文档将数据传送给处理程序。：当前文档将数据传送给处理程序。2)GET：处理程序从当前文档取用数据。：处理程序从当前文档取用数据。3.2.6 表表单标记单标记（FORM）作用：定）作用：定义义一个表一个表单单，供后，供后续设续设二、二、INPUT标记标记1、单行文本域：、单行文本域：文本框文本框v作用：作用：用来接收用户输入的单行文本内容。用来接收用户输入的单行文本内容。v格式：格式：2、密码域、密码域v作用：作用：用来接收用户输入的密码信息。用来接收用户输入的密码信息。v格式：格式：二、二、INPUT标记标记1、单单行文本域：行文本域：文本框文本框2、密、密码码域域二、二、INPUT标记标记4、提交按钮、提交按钮 v作用：作用：将表单中用户所填信息提交给服务器的处理程序。将表单中用户所填信息提交给服务器的处理程序。v格式：格式：5、重置按钮、重置按钮v作用：作用：清除用户在表单中所填的内容，供重新填写。清除用户在表单中所填的内容，供重新填写。v格式：格式：二、二、INPUT标记标记4、提交按、提交按钮钮 5、重置按、重置按钮钮二、二、INPUT标记标记6、图像域、图像域 v作用：作用：用来提交表单的图像区域用来提交表单的图像区域。v格式：格式：二、二、INPUT标记标记6、图图像域像域 二、二、INPUT标记标记7、单选钮、单选钮 v作用：作用：供用户在若干选项中选择一项供用户在若干选项中选择一项。v格式：格式：v说明：说明：1)需需多个同名多个同名单选钮配合使用。单选钮配合使用。2)在若干个连续的同名单选钮选项中，只能选择在若干个连续的同名单选钮选项中，只能选择 一项。一项。二、二、INPUT标记标记7、单选钮单选钮 二、二、INPUT标记标记8、复选框、复选框 v作用：作用：供用户进行项目勾选。供用户进行项目勾选。v格式：格式：v说明：说明：同时提供多个复选框供选择，但名字不可相同。同时提供多个复选框供选择，但名字不可相同。二、二、INPUT标记标记8、复、复选选框框 三、三、TEXTAREA标记标记v作用：作用：创建一个多行文本域（编辑框），用来接收用户创建一个多行文本域（编辑框），用来接收用户 输入的多行文本内容。输入的多行文本内容。v格式：格式：三、三、TEXTAREA标记标记作用：作用：创创建一个多行文本域（建一个多行文本域（编辑编辑框），框），四、四、SELECT OPTION标记标记 v作用：作用：创建列表框或下拉式列表框。创建列表框或下拉式列表框。v格式：格式：选项选项 选项选项 四、四、SELECT OPTION标记标记 作用：作用：创创建列表框或建列表框或四、四、SELECT OPTION标记标记 v属性属性：1)Size：列表框的行数。默认为：列表框的行数。默认为1，是下拉式列表框；，是下拉式列表框；普通列表框，普通列表框，size值要大于值要大于1。2)selected：该项被选择。：该项被选择。3)multiple：在普通列表框中允许对选项进行多选。：在普通列表框中允许对选项进行多选。四、四、SELECT OPTION标记标记 属性属性：3.2.7 框架标记框架标记(FRAMESET FRAME)v可以使用框架将窗口划分为几个子窗口，这样可实现可以使用框架将窗口划分为几个子窗口，这样可实现 在一个浏览窗口打开几个网页。在一个浏览窗口打开几个网页。v创建框架用到的主要标记有：创建框架用到的主要标记有：FRAMESET框架集，框架集，FRAME框架框架v框架包含在框架集中。无框架的框架集没有意义。框架包含在框架集中。无框架的框架集没有意义。3.2.7 框架框架标记标记(FRAMESET FRAME)4.1 基础知识基础知识v一、网页基本构成元素文字、图形图像、动画与视频、声音；超链接、网页程序、表单、框架等v二、工作环境1、启动与退出启动：开始开始程序程序 macromedia Dreamweaver MX 20042、工作界面 4.1 基基础础知知识识一、网一、网页页基本构成元素基本构成元素4.1 基础知识基础知识 文件面板属性面板文档窗口文档窗口主窗口主窗口标题栏菜单栏文档状态栏标签选择器“视图选择”按钮文档编辑区面板组“插入”工具栏“文档”工具栏4.1 基基础础知知识识文件面板属性面板文档窗口主窗口文件面板属性面板文档窗口主窗口标题栏标题栏菜菜单栏单栏4.1 基础知识基础知识说明说明:1.“插入”工具栏：包含有常用、布局、表单、文包含有常用、布局、表单、文本、本、HTMLHTML、应用元素、应用元素、FLASHFLASH元素等工具组元素等工具组 ,供供用户方便地向文档中加入各类对象用户方便地向文档中加入各类对象。其选项多和。其选项多和“插入插入”菜单项有对应。菜单项有对应。2.面板组：多个面板的集合，可进行页面的编辑和多个面板的集合，可进行页面的编辑和控制。控制。属性面板:用来查看和设置所选对象的各属性用来查看和设置所选对象的各属性文件面板:用来管理站点文件和文件夹。用来管理站点文件和文件夹。4.1 基基础础知知识说识说明明:4.1 基础知识基础知识3.视图选择钮:包括包括“代码代码”、“拆分拆分”、“设计设计”三种视图模式三种视图模式.4.标签选择器:用来通过标签选定网页内容用来通过标签选定网页内容三、创建站点“站点”“管理站点”四、创建一简单网页4.1 基基础础知知识识3.视图选择钮视图选择钮:包括包括“代代码码”、“拆分拆分”、“4.1 基础知识基础知识五、文件操作1、基本文件操作：新建、保存、关闭、打开、预览（F12）2、设置页面属性作用:设置页面内容的默认字样、颜色、背景设置页面内容的默认字样、颜色、背景等。等。方法:修改修改/页面属性页面属性.(或右击页面或右击页面页面属性页面属性)4.1 基基础础知知识识五、文件操作五、文件操作4.2 文本处理文本处理1.输入普通文本:直接输入.2.输入日期、特殊字符等:使用“插入”菜单或“插入”工具栏.3.换行:SHIFT+回车.()4.换段:直接回车.()5.输入多个空格:按CTRL+SHIFT+空格键.( )也可输入全角空格.【设置文本属性:】利用属性面板4.2 文本文本处处理理1.输输入普通文本入普通文本:直接直接输输入入.4.3 图像处理图像处理1.加入图像:利用利用“插入插入”菜单或菜单或“插入插入”工具栏工具栏图像属性设置:利用属性面板利用属性面板【属性说明:】v 宽高值：可调整图像为指定大小。v 替代：可在其后的框中输入文字，浏览时，这些文字会成为图像的说明文字。并且，当浏览器端不能正确显示图像时，这些文字将被显示在图像位置。v对齐4.3 图图像像处处理理1.加入加入图图像像:利用利用“插入插入”菜菜单单或或“插入插入”4.3 图像处理图像处理2.加入水平线加入水平线:“插入”菜单“HTML”选项“水平线”3.加入鼠标经过图像加入鼠标经过图像方法：“插入”工具栏选“常用”组;展开“图像”工具按钮，选择“鼠标经过图像”。(也可以在“插入”菜单中选择“图像对象”，然后选“鼠标经过图像”)4.3 图图像像处处理理2.加入水平加入水平线线:4.4 超链接超链接链接媒介:网页中的文字、图像等网页元素一.建立文字链接作用:通过点击链接文字打开链接目标.常用链接:页间链接,锚记链接,文件链接,邮件链接,空链接等1、添加页间链接 作用:通过链接文字链接到某网址或本站点中的某网页文档。方法:在属性面板将选定文字的链接属性设为本地网页或某站点的URL4.4 超超链链接接链链接媒介接媒介:网网页页中的文字、中的文字、图图像等网像等网页页元素元素4.4 超链接超链接2.添加锚记链接(页内链接)作用:通过链接文字跳转到网页中某锚记标识所在的位置 方法:将网页中要标识的位置加入命名锚记，然后使链接文字的链接属性为#3.添加非网页文件链接作用:通过链接文字链接到非网页文件方法:将文字的链接属性设为非网页文件4.4 超超链链接接2.添加添加锚记链锚记链接接(页页内内链链接接)4.4 超链接超链接4.添加邮件链接作用:通过链接文字启动电子邮件程序，允许用户书写电子邮件并发送到指定邮件地址方法:将链接文字的链接属性设为：mailto:5.添加空链接作用:空链接是一个未设计的链接，可使文本产生链接的形式.(要为文本添加行为,需先为文本设置空链接)方法:选择文本后，在属性面板的“链接”框中输入“#”或“javascript:;”4.4 超超链链接接4.添加添加邮邮件件链链接接4.4 超链接超链接6.添加脚本链接作用:可用来执行JavaScript代码或调用JavaScript函数方法:选择文本后在属性面板“链接”框输入“javascript:”,及一些javaScript代码7.设置链接样式“页面属性”“链接”4.4 超超链链接接6.添加脚本添加脚本链链接接4.4 超链接超链接8.绝对地址与相对地址v绝对路径：绝对路径是指包含服务器协议在内的完全路径。例如：http:/ 超超链链接接8.绝对绝对地址与相地址与相对对地址地址4.5 建立表格建立表格一.创建表格方法一:“插入”工具栏“常用”组的“表格”工具;方法二:“插入”菜单的“表格”项。二.编辑表格1.选择表格：移鼠标指针到表格的左上角或左下角,使其变为“表格指针”形状时单击；或单击任一单元格,然后在文档窗口底端的“标签选择器”选择。4.5 建立表格一建立表格一.创创建表格建表格4.5 建立表格建立表格2.选择行：移鼠标指针到行的左端，使其变为指向右的实箭头，然后单击或拖动；若选择一行，也可以单击该行某单元格，然后在“标签选择器”选择。3.选择列：移鼠标指针到列的顶端，使其变为指向下的实箭头，然后单击或拖动。4.选择单元格：选择一个单元格，可单击该单元格，然后执行CTRL+A，或在“标签选择器”选择；选择一个单元格范围，可单击起始单元格后，向右下拖动至终止单元格.4.5 建立表格建立表格2.选择选择行：移鼠行：移鼠标标指指针针到行的左端，使其到行的左端，使其变为变为指指4.5 建立表格建立表格5.删除表格、表行或表列:选定,按Delete.6.插入表行或表列:单击插入位置,修改/表格插入行(插入列)7.合并或拆分单元格:选定要合并或拆分的单元格,在属性面板或“修改”菜单进行合并或拆分.8.边框设置及其它表格设置:选定,然后在属性面板或“修改/表格”菜单进行.替代替代4.5 建立表格建立表格5.删删除表格、表行或表列除表格、表行或表列:选选定定,按按De4.6 表单的制作表单的制作作用:制作网页中与用户交互的界面.创建方法:先创建表单,然后向其中添加表单对象.一.创建表单方法：（1）在“插入”工具栏选择“表单”组；（2）单击“表单”工具按钮。此时页面中会出现表示表单区域的红色框线；（3）在属性面板设置表单的属性。4.6 表表单单的制作作用的制作作用:制作网制作网页页中与用中与用户户交互的界面交互的界面.4.6 表单的制作表单的制作二.向表单中添加表单对象表单对象包括：文本字段、文本区域、单选钮、单选按钮组、复选框、列表/菜单、跳转菜单、文件域、按钮、图像域等.加入方法：利用“表单”工具栏或“表单”子菜单向表单中加入表单对象，然后再利用属性面板对其进行设置.例:建立表单后,向其中插入表格,然后在表格中加入各表单对象。4.6 表表单单的制作二的制作二.向表向表单单中添加表中添加表单对单对象象4.6 表单的制作表单的制作一、文本字段作用：向表单加入文本域，用来接收用户输入的文本。分类：分为单行、多行、密码三种类型。标签：input或textarea v二、文本区域作用、分类及标签同文本字段。默认类型为“多行”。4.6 表表单单的制作一、文本字段的制作一、文本字段4.6 表单的制作表单的制作三、复选框作用：向表单中加入复选框标签：input四、单选钮作用：向表单中加入单选钮标签：input 五、单选按钮组作用：向表单中加入共享同一名称的一组单选按钮标签：input4.6 表表单单的制作三、复的制作三、复选选框框4.6 表单的制作表单的制作三、复选框作用：向表单中加入复选框标签：input四、单选钮作用：向表单中加入单选钮标签：input 五、单选按钮组作用：向表单中加入共享同一名称的一组单选按钮标签：input4.6 表表单单的制作三、复的制作三、复选选框框4.6 表单的制作表单的制作六、列表/菜单作用：向表单中加入列表框或下拉列表框。分类：分为列表、菜单两种类型。说明：此处的“菜单”实为Windows介绍中所述的“下拉列表框”标签：select七、跳转菜单作用：向表单中加入允许对其内容设置链接的列表框或下拉列表框。分类及标签：同“列表/菜单”4.6 表表单单的制作六、列表的制作六、列表/菜菜单单4.6 表单的制作表单的制作八、文件域作用：加入空白文本域和“浏览”按钮，供用户输入或选择用来上传的磁盘文件。标签：input。代码格式：input type=file 九、按钮作用：用来在表单中加入文本按钮。分类：分为提交按钮、重置按钮、无动作按钮。十、图像域、标签4.6 表表单单的制作八、文件域的制作八、文件域4.7 层的使用层的使用一、创建与编辑层1、创建：“插入”“布局对象”“层”或“插入”工具栏2、编辑：“属性面板”二、为层加入运动右击层“记录路径”4.7 层层的使用一、的使用一、创创建与建与编辑层编辑层4.9 加入多媒体元素加入多媒体元素一、加入音频1、加入背景音乐“行为面板”“+”“播放声音”“属性面板”“参数”“autostart”设为“true”2、加入音频、视频播放“插入”“媒体”“插件”“属性面板”调整大小“参数”“autostart”设为“true”4.9 加入多媒体元素一、加入音加入多媒体元素一、加入音频频4.9 加入多媒体元素加入多媒体元素二、加入Flash对象1、加入Flash影片“插入”“媒体”“Flash”2、加入Flash文本“插入”“媒体”“Flash”“属性面板”调整大小“参数”“autostart”设为“true”4.9 加入多媒体元素二、加入加入多媒体元素二、加入Flash对对象象v4.10 框架v4.11 CSS样式的创建与使用v行为v创建日历控件v网站相册v滚动字幕4.10 框架框架谢谢浏览谢谢浏览谢谢浏览