《Web网站规划与建设案例教程》第二章利用Html写简单网页【学习导航】本章主要介绍HTML的基本知识，包括HTML的基本结构、文字、图像、表格及多媒体的插入等标签的使用方法，另外，还介绍了javascript语言的基本使用方法。【学习目标】1）了解和掌握html的基本结构。2）掌握html常用标签的使用方法。3）能够用html编写简单的网页。2.1html概述与基本结构2.2html主体标签及属性、颜色的设定 2.3文字版面的编辑2.4建立超链接2.5建立列表2.6图像的处理 2.7TABLE表格 2.8网页的动态、多媒体效果2.9多视窗口框架2.10表单的设计 2.11Javascript基础2.12上机任务与指导2.13本章小结2.14练习与提高2.1html概述与基本结构Html即HypertextMarkedLanguage的缩写，即超文本标记语言，是一种用来制作超文本文档的简单标记语言。所谓超文本，是因为它可以加入图片、声音、动画、影视等内容，事实上每一个html文档都是一种静态的网页文件，这个文件里面包含了html指令代码，这些指令代码并不是一种程序语言，它只是一种排版网页中资料显示位置的标记结构语言，易学易懂，非常简单。用html编写的超文本文档称为html文档，它能独立运行于各种操作系统平台，自1990年以来html就一直被用作ＷＷＷ的信息表示语言，使用html语言描述的文件，需要通过WEB浏览器显示出效果。在使用html超文本文件时需要用到的一些标签。在html中每个用来做标签的符号都是一条命令，它告诉浏览器如何显示文本。这些标签均由"<"和">"符号以及一个字符串组成。而浏览器的功能是对这些标记进行解释，显示出文字、图像、动画或播放声音。这些标签符号用“<标签名字属性>”来表示。html只是一个纯文本文件。创建一个html文档，只需要两个工具，一个是html编辑器，一个是WEB浏览器。html编辑器是用于生成和保存HTML文档的应用程序。WEB浏览器是用来打开html网页文件，提供给查看WEB资源的客户端程序。2.1.2html的基本结构一个html文档是由一系列的元素和标签组成，元素名不区分大小写。html用标签来规定元素的属性和它在文件中的位置，html超文本文档分文档头和文档体两部分。在文档头里，对这个文档进行了一些必要的定义，文档体中才是要显示的各种文档信息。实例2-1，2-1.html代码：<html><head><title>一个简单的html示例</title> </head><body><center> <h1>欢迎光临我的主页</h1> <br><hr> <fontsize="7"color="red"> 这是我第一次做主页</font></center></body></html>实例代码说明：<html></html>在文档的最外层，文档中的所有文本和html标签都包含在其中，它表示该文档是以超文本标识语言（html）编写的。事实上，现在常用的Web浏览器都可以自动识别html文档，并不
要求
对教师党员的评价套管和固井爆破片与爆破装置仓库管理基本要求三甲医院都需要复审吗
有<html>标签，也不对该标签进行任何操作，但是为了使html文档能够适应不断变化的Web浏览器，还是应该养成不省略这对标签的良好习惯。<head></head>是html文档的头部标签,在浏览器窗口中，头部信息是不被显示在正文中的,在此标签中可以插入其它标记,用以说明文件的标
题
快递公司问题件快递公司问题件货款处理关于圆的周长面积重点题型关于解方程组的题及答案关于南海问题
和整个文件的一些公共属性。若不需头部信息则可省略此标记，但良好的习惯是不省略。<title>和</title>是嵌套在<head>头部标签中的，标签之间的文本是文档标题，它被显示在浏览器窗口的标题栏。<body></body>标记一般不省略，标签之间的文本是正文，是浏览器要显示的页面内容。上面的这几对标签在文档中都是唯一的，head标签和body标签嵌套在html标签中。2.1.3html的标签与属性标签通过指定某块信息为段落或标题等来标识文档某个部件。属性是标签里的
参数
转速和进给参数表a氧化沟运行参数高温蒸汽处理医疗废物pid参数自整定算法口腔医院集中消毒供应
的选项，html的标签分单标签和成对标签两种。成对标签是由首标签<标签名>和尾标签</标签名>组成的，成对标签的作用域只作用于这对标签中的文档。单独标签的格式<标签名>，单独标签在相应的位置插入元素就可以了，大多数标签都有自己的一些属性,属性要写在始标签内，属性用于进一步改变显示的效果,各属性之间无先后次序，属性是可选的，属性也可以省略而采用默认值；其格式如下： <标签名字属性1属性2属性3…>内容</标签名字>作为一般的原则，大多数属性值不用加双引号。但是包括空格、％号、＃号等特殊字符的属性值必须加入双引号。为了养成好的习惯，提倡对全部属性值加双引号。如：<fontcolor="#ff00ff"face="宋体"size="30">字体设置</font>注意：输入始标签时，一定不要在“<”与标签名之间输入多余的空格，也不能在中文输入法状态下输入这些标签及属性，否则浏览器将不能正确的识别括号中的标签命令，从而无法正确的显示信息。2.2html主体标签及属性、颜色的设定 2.2.1html的主体标签<body>在<body>和</body>中放置的是页面中所有的内容，如图片、文字、表格、表单、超链接等内容。<body>标签有自己的属性，设置<body>标签内的属性，可控制整个页面的显示方式。实例2-2<body>的属性设定了页面的背景颜色，文字的颜色，链接的颜色为#3300ff，单击的链接颜色为#ff00ff，单击过后的颜色为#9900ff。body里面的是页面中的链接标签，对于属性可根据页面的效果来定。属 性描 述link设定页面默认的链接颜色alink设定鼠标正在单击时的链接颜色vlink设定访问后链接文字的颜色background设定页面背景图像bgcolor设定页面背景颜色leftmargin设定页面的左边距topmargin设定页面的上边距bgproperties设定页面背景图像为固定，不随页面的滚动而滚动text设定页面文字的颜色2.2.2颜色的设定颜色值是一个关键字或一个RGB格式的数字。WindowsVGA（视频图像阵列）形成了16个关键字: aqua，black，blue，fuchsia,gray，green，lime，maroon，navy，olive，purple，red，silver，teal，white，yellow。RGB：称为色光三原色，分别为红、绿、蓝，使用加色法，直接通到我们的人眼，比如屏幕显示。在html中对颜色的定义是用十六进制的，对于三原色html分别给予两个十六进制位去定义（占一个字节，8位，取值范围0-255），也就是每个原色可有256种彩度，故此三原色可混合成16777216种颜色。其数值为R：0-255G、0-255B、0-255RGB值越大，就越亮，所以当RGB都为255时为白色，相反全为零时为黑色。2.2.2颜色的设定例如： 白色的组成是red=ff,green=ff,blue=ff,RGB值即为ffffff红色的组成是red=ff,green=00,blue=00,RGB值即为ff0000绿色的组成是red=00,green=ff,blue=00,RGB值即为00ff00蓝色的组成是red=00,green=00,blue=ff,RGB值即为0000ff黑色的组成是red=00,green=00,blue=00,RGB值即为0000002.2.2颜色的设定应用时常在每个RGB值之前加上“#“符号，如：bgcolor="#336699"或者直接写关键字。如bgcolor=green。RGB颜色可以有四种表达形式:：#rrggbb(如：#00cc00)#rgb(如：#ff0)rgb(x,x,x)x是一个介乎0到255之间的整数(如：rgb(0,204,0))rgb(y%,y%,y%)y是一个介乎0.0到100.0之间的整数(如：rgb(0%,80%,0%)2.3文字版面的编辑2.3.1换行标签<br>换行标签是个单标签，也叫空标签，不包含任何内容，在html文件中的任何位置只要使用了<br>标签，当文件显示在浏览器中时，该标签之后的内容将显示下一行。实例2-3，2-3.html代码：2.3.2换段落标签<p>及属性：由<p>标签所标识的文字，代表同一个段落的文字。不同段落间的间距等于连续加了两个换行符，也就是要隔一行空白行，用以区别文字的不同段落。它可以单独使用，也可以成对使用。单独使用时，下一个<p>的开始就意味着上一个<p>的结束。良好的习惯是成对使用。格式：<p><palige=参数>其中,alige是<p>标签的属性,属性有三个参数left,center,right.这三个参数设置段落文字的左,中,右位置的对齐方式.例子2-42.3.3原样显示文字标签<pre>要保留原始文字排版的格式,就可以通过<pre>标签来实现,方法是把制作好的文字排版内容前后分别加上始标签<pre>和尾标签</pre>实例2-5，2-5.html代码2.3.4居中对齐标签<center>文本在页面中使用<center>标签进行居中显示,<center>是成对标签,在需要居中的内容部分开头处加<center>,结尾处加</center>。实例2-6，2-6.html代码：2.3.5引文标签(缩排标签）<blockquote><blockquote>标签可以用来建立一个引文，适合较长文本的引用，引文显示时将会自动右移，左边空出几个格。实例2-7，2-7.html代码2.3.6水平分隔线标签<hr><hr>标签是单独使用的标签，是水平线标签，用于段落与段落之间的分隔，使文档结构清晰明了，使文字的编排更整齐。通过设置<hr>标签的属性值，可以控制水平分隔线的样式。2-8.html代码表2.2<hr>标签的属性属性参数功能单位默认值size设置水平分隔线的粗细pixel(像素）像素）2width设置水平分隔线的宽度pixel(像素）%像素）%100%alignleftcenterright设置水平分隔线的对齐方式centercolor设置水平分隔线的颜色blacknoshade取消水平分隔线的3d阴影3d阴影2.3.7署名标签<address> <address>署名标签一般用于说明这个网页是由谁或是由哪个公司编写的，或其它相关信息。在<address></address>标签之间的文字显示效果是斜体字。实例2-9，2-9.html代码：2.3.8特殊字符在html文档中，有些字符没办法直接显示出来，使用特殊字符可以将键盘上没有的字符表达出来，而有些html文档的特殊字符在键盘上虽然可以得到，但浏览器在解析html文当时会报错，例如"<"等，为防止代码混淆，必须用一些代码来表示它们。实例2-10，2-10.html代码表2.3html几种常见特殊字符及其代码特殊或专用字符字符代码特殊或专用字符字符代码<<©©>>××&&®®""空格2.3.9注释标签在html文档中可以加入相关的注释标记，便于查找和记忆有关的文件内容和标识，这些注释内容并不会在浏览器中显示出来。注释标签的格式有如下：<!--注释的内容--> 实例2-11，2-11.html代码：2.3.10字体属性1、标题文字标签<hn><hn>标签用于设置网页中的标题文字，被设置的文字将以黑体或粗体的方式显示在网页中。标题标签的格式：<hnalign=参数〉标题内容</hn>实例2-12，2-12.html代码：2、文字格式控制标签<font><font>标签用于控制文字的字体，大小和颜色。控制方式是利用属性设置得以实现的。表2.4font标签的属性格式：<fontface=值1size=值2color=值3〉文字</font>说明：如果用户的系统中没有face属性所指的字体，则将使用默认字体。size属性的取值为1~7。也可以用"+"或"-"来设定字号的相对值。color属性的值为：rgb颜色"#nnnnnn"或颜色的名称属性使用功能默认值face设置文字使用的字体宋体size设置文字的大小3color设置文字的颜色黑色3、特定文字样式标签在有关文字的显示中，常常会使用一些特殊的字形或字体来强调、突出、区别以达到提示的效果。在html中用于这种功能的标签可以分为两类，物理类型和逻辑类型。a、物理类型(1) 粗体标签<b>： 放在<b>与</b>标签之间的文字将以粗体方式显示。(2) 斜体标签<i>： 放在<i>与</i>标签之间的文字将以斜体方式显示。（3）下划线标签<u>：放在<u>与</u>标签之间的文字将以下划线方式显示。实例2-14，2-14.html代码b、逻辑类型逻辑类型是使用一些标签来改变字体的形态和式样，以便产生一些浏览者习惯的或约定的显示效果，常用的逻辑类型标签有八种，放在标签之间的文字受其控制。下面请看常用逻辑标签的实例实例2-15，2-15.html代码2.4建立超链接html文件中最重要的应用之一就是超链接，web上的网页是互相链接的，单击被称为超链接的文本或图形就可以链接到其它页面。建立超链接的标签为<a>和</a>格式为：<ahref="资源地址" targert="窗口名称"title="指向链接显示的文字">超链接名称</a>说明：标签<a>表示一个链接的开始，</a>表示链接的结束；属性“href”定义了这个链接所指的目标地址；目标地址是最重要的，一旦路径上出现差错，该资源就无法访问。Target：该属性用于指定打开链接的目标窗口，其默认方式是原窗口。title：该属性用于指定指向链接时所显示的标题文字。“超链接名称”是要单击到链接的元素，元素可以包含文本，也可以包含图像。文本带下划线且与其它文字颜色不同，图形链接通常带有边框显示。用图形做链接时只要把显示图像的标志<img>嵌套在<ahref="URL"></a>之间就能实现图像链接的效果。当鼠标指向"超链接名称"处时会变成手状，单击这个元素可以访问指定的目标文件。属性值描述_parent在上一级窗口中打开，一般使用分桢的框架页会经常使用_blank在新窗口打开_self在同一个桢或窗口中打开，这项一般不用设置_top在浏览器的整个窗口中打开，忽略任何框架2.4.1超链接的应用 1．书签链接格式：在同一页面要使用链接的地址：<ahref="#书签名称"target="窗口名称">超连链标题名称</a>在不同页面要使用链接的地址：<ahref="URL地址#书签名称"target="窗口名称">超链接标题名称</a>链接到的目的地址：<aname="书签名称">目标超链接名称</a>name的属性值为该目标定位点的定位标记点名称，是给特定位置点(这个位置点也叫锚点)起个名称。实例2-16，2-16.html代码2.在站点内部建立链接所谓内部链接，指的是在同一个网站内部，不同的html页面之间的链接关系，在建立网站内部链接的时候，要明确哪个是主链接文件（即当前页），哪个是被链接文件。内部链接一般采用相对路径链接比较好。如图2-17所示，来看看相对路径的具体的链接方法:当前页面被链接页面超链接代码2-1.html3-1.html<ahref="3-1.html">超链接元素</a>3-1.html1-1.html<ahref="asm/1-1.html">超链接元素</a>sy.html1-1.html<ahref="ssm/asm/1-1.html">超链接元素</a>2-1.htmlsy.html<ahref="../sy.html">超链接元素</a>1-1.htmlsy.html<ahref="../../sy.html">超链接元素</a>sy.html2-1.html<ahref="ssm/2-1.html">超链接元素</a>3．外部链接所谓外部链接，指的是跳转到当前网站外部，与其它网站中页面或其它元素之间的链接关系。这种链接的URL地址一般要用绝对路径，要有完整的URL地址，包括
协议
离婚协议模板下载合伙人协议 下载渠道分销协议免费下载敬业协议下载授课协议下载
名，主机名，文件所在主机上的的位置的路径以及文件名。最常用的外部链接格式是：<ahref="http://网址">,还有其它的格式如下表所示 站点之间的页面和元素的链接是万维网交流信息的关键，这种链接用HTTP协议来建立网站之间的超链接。 格式：<ahref="HTTP://"网址"> 实例2-17，2-17.html代码：服务URL格式描述WWWhttp://"URL"进入万维网站点FtpURL"进入文件传输协议Telnettelnet://"URL"启动Telnet方式Gophergopher://"URL"访问一个gopher服务器Newsnews://"URL"启动新闻讨论组Emailemail://"URL"启动邮件4．发送E-mail在html页面中，可以建立E-mail链接。当浏览者单击链接后，系统会启动默认的本地邮件服务系统发送邮件。基本语法：<ahref="mailto:E-mali地址: subject=邮件主题">描述文字</a>实例2-18，2-18.html代码：2.5建立列表在html页面中，合理的使用列表标签可以起到提纲和格式排序文件的作用。表分为两类，一是无序列表，一是有序列表，标签描述<UL>无序列表<OL>有序列表<DIR>目录列表<DL>定义列表<MENU>菜单列表<DL>/<DT>/<DD>定义列表的标记<LI>列表项目的标记2.5.1无序列表<UL>无序列表使用的一对标签是<ul></ul>。无序列表指没有进行编号的列表, 每一个列表项前使用<LI>。<LI>的属性type有三个选项,这三个选项都必须小写:disc实心园，circle空心园，square小方块，默认为实心圆。格式1：<ul> <li>第一项 <li>第二项 <li>第三项 </ul>格式2：<ul> <litype=disc>第一项 <litype=circle>第二项 <litype=square>第三项</ul>实例2-19，2-19.html代码2.5.2有序列表<OL>有序列表和无序列表的使用格式基本相同，它使用标签<ol></ol>，每一个列表项前使用<li>。<ol>列表的结果是带有前后顺序之分的编号。如果插入和删除一个列表项，编号会自动调整。表2.11有序列表type的属性type类型类型描述type=1表示列表项目用数字标号（1,2,3...）1,2,3...）type=A表示列表项目用大写字母标号（A,B,C...）A,B,C...）type=a表示列表项目用小写字母标号（a,b,c...）a,b,c...）type=I表示列表项目用大写罗马数字标号（Ⅰ,Ⅱ,Ⅲ...）,Ⅱ,Ⅲ...）type=i表示列表项目用小写罗马数字标号（i,ii,iii...）i,ii,iii...）格式1 <oltype=编号类型start=value> <li>第1项 <li>第2项 <li>第3项 </ol>格式2 <ol> <li>第1项 <li>第2项 <li>第3项 </ol>实例2-20，2-20.html代码2.5.3嵌套列表将一个列表嵌入到另一个列表中，作为另一个列表的一部分，叫嵌套列表。无论是有序列表和无序列表的嵌套，浏览器都可以自动地分成排列。实例2-21，2-21.html代码：2.5.4定义列表的标记<DL>/<DT>/<DD>定义列表的标记也叫描述性列表，定义列表默认为两个层次，第一层为列表项标签<DT>，第二层为注释项标签<DD>。<DT>和<DD>标签通常是成对使用的。也可以一个列表项对应于几个解释项，这种方式很少用。<DD>默认的注释是显示在另一行中,当使用<dlcompact="compact">后,注释项和列表项将显示在同一行。其格式为： <dl> <dt>第1项<dd>注释1 <dt>第2项<dd>注释2 <dt>第3项<dd>注释3 </dl>实例2-22，2-22.html代码2.5.5目录列表<DIR>和菜单列表<MENU><dir>为目录列表标签,<menu>为菜单列表标签,它们的格式和无序列表<ul>是一样的,例如:格式1:<dir> <li>第一项 <li>第二项 <li>第三项</dir>格式2<menu> <litype=disc>第一项 <litype=circle>第二项 <litype=square>第三项</menu>实例2-23，2-23.html代码：2.6图像的处理 浏览器可以显示的图像格式有jpeg，bmp，gif。2.6.1背景图像的设定在网页中除了可以用单一的颜色做背景外，还可用图像设置背景。设置背景图像的格式：<bodybackground="image-url">其中"image-url"指图像的位置。实例2-24，2-24.html代码2.6.2网页中插入图片标签<img> 网页中插入图片用单标签<img>，当浏览器读取到<img>标签时，就会显示此标签所设定的图像。如果要对插入的图片进行修饰时，仅仅用这一个属性是不够的，还要配合其它属性来完成。<img>标签属性见表2.12.<IMG>的格式及一般属性设定：<imgsrc="logo.gif"width=100height=100hspace=5vspace=5border=2align="top"alt="LogoofPenPalsGarden"lowsrc="pre_logo.gif">实例2-25，2-25.html代码：属性描述src图像的url的路径url的路径alt提示文字width宽度通常只设为图片的真实大小以免失真,改变图片大小最好用图像工具.,改变图片大小最好用图像工具.height高度通常只设为图片的真实大小以免失真,改变图片大小最好用图像工具.,改变图片大小最好用图像工具.dynsrcavi文件的url的路径文件的url的路径loop设定avi文件循环播放的次数avi文件循环播放的次数loopdelay设定avi文件循环播放延迟avi文件循环播放延迟start设定avi文件的播放方式avi文件的播放方式lowsrc设定低分辨率图片,若所加入的是一张很大的图片，可先显示图片。,若所加入的是一张很大的图片，可先显示图片。usemap映像地图align图像和文字之间的排列属性border边框hspace水平间距vlign垂直间距<IMG>的格式及一般属性设定：<imgsrc="logo.gif"width=100height=100hspace=5vspace=5border=2align="top"alt="LogoofPenPalsGarden"lowsrc="pre_logo.gif">实例2-25，2-25.html代码：2.7TABLE表格2.7.1定义表格的基本语法在一个最基本的表格中，必须包含一组<table>标签，一组标签<tr>和一组<td>标签或<th>。标签描述<table>...</table>用于定义一个表格开始和结束<th>...</th>定义表头单元格。表格中的文字将以粗体显示，在表格中也可以不用此标签，<th>标签必须放在<tr>标签内<th>标签必须放在<tr>标签内<tr>...</tr>定义一行标签，一组行标签内可以建立多组由<td>或<th>标签所定义的单元格<td>或<th>标签所定义的单元格<td>...</td>定义单元格标签，一组<td>标签将将建立一个单元格，<td>标签必须放在<tr>标签内<td>标签将将建立一个单元格，<td>标签必须放在<tr>标签内2.7.2表格<table>标签的属性表2.14<table>标签的属性属性描述width表格的宽度height表格的高度align表格在页面的水平摆放位置background表格的背景图片bgcolor表格的背景颜色border表格边框的宽度（以像素为单位）bordercolor表格边框颜色bordercolorlight表格边框明亮部分的颜色bordercolordark表格边框昏暗部分的颜色cellspacing单元格之间的间距cellpadding单元格内容与单元格边界之间的空白距离的大小2.7.3设定跨多行多列单元格要创建跨多行、多列的单元格，只需在<th>或<td>中加入rowspan或colspan属性的属性值，表示表格中要跨越的行或列的个数，默认值为1。跨多列的语法：<thcolspan=#> <tdcolspan=#>colspan表示跨越的列数，例如colspan=2表示这一格的宽度为两个列的宽度。跨多行的语法：<throwspan=#> <tdrowspan=#> rowspan所要表示的意义是指跨越的行数，例如rowspan=2就表示这一格跨越表格两个行的高度。2.8网页的动态、多媒体效果2.8.1滚动字幕<marquee><marquee>标签可以实现元素在网页中移动的效果，以达到动感十足的视觉效果。<marquee>标签是一个成对的标签。应用格式为：<marquee>...</marquee>属性描述align指定对齐方式top,middle,bottomscroll单向运动slide如幻灯片，一格格的，效果是文字一接触左边就停止。alternate左右往返运动bgcolor设定文字卷动范围的背景颜色loop设定文字卷动次数，其值可以是正整数或infinite表示无限次默认为无限循环height设定字幕高度width设定字幕宽度scrollamount指定每次移动的速度,数值越大速度越快scrolldelay文字每一次滚动的停顿时间，单位是毫秒。时间越短滚动越快hspace指定字幕左右空白区域的大小vspace指定字幕上下空白区域的大小direction设定文字的卷动方向,left表示向左,right表示向右,up表示往上滚动behavior指定移动方式，scroll表示滚动播出，slibe表示滚动到一方后停止，alternate表示滚动到一方后向相反方向滚动。2.8.2插入多媒体文件在网页中可以用<embed>标签将多媒体文件插入，比如可以插入音乐和视频等。可以播放的音乐格式有：MIDI音乐、WAV音乐、mp3、AIFF、AU格式等。<embed>标签的使用格式：<embedsrc="音乐文件地址">，其常用属性见表2.18所示。实例2-30，2-30.html代码SRC="FILENAME"设定音乐文件的路径AUTOSTART=TRUE/FALSE是否要音乐文件传送完就自动播放，TRUE是要，FALSE是不要，默认为FALSELOOP=TRUE/FALSE设定播放重复次数，LOOP=6表示重复6次，TRUE表示无限次播放，FALSE播放一次即停止。STARTIME="分:秒"设定乐曲的开始播放时间，如20秒后播放写为STARTIME=00:20VOLUME=0-100设定音量的大小。如果没设定的话，就用系统的音量。widthHEIGHT设定播放控件面板的大小HIDDEN=TRUE隐藏播放控件面板CONTROLS=CONSOLE/SM-ALLCONSOLE设定播放控件面板的样子2.8.3嵌入多媒体文件除了可以使用上述方法插入多媒体文件外，还可以在网页中嵌入多媒体文件，这种方式将不调用媒体播放器1.嵌入背景音乐 <bgsound>标签用来设置网页的背景音乐。但只适用於IE，其参数设定不多。格式如下： <BGSOUNDsrc="your.mid"autostart=trueloop=infinite>2.9多视窗口框架浮动窗口：<iframe><iframe>的参数设定格式：<iframesrc="iframe.html"name="test"align="MIDDLE"width="300"height="100"marginwidth="1"marginheight="1"frameborder="1"scrolling="Yes">表2.19<iframe>属性的含义属性含义src浮动窗框中的要显示的页面文件的路径，可以是相对或绝对。name此框窗名称，这是链接标记的target参数所用align可选值为left,right,top,middle,bottomheight框窗的高，以pixels为单位。width框窗的宽，以pixels为单位。marginwidth该插入的文件与框边所保留的空间。marginheight该插入的文件与框边所保留的空间。frameborder使用1表示显示边框，0则不显示。（可以是yes或no）scrolling使用Yes表示容许卷动（内定），No则不容许卷动。2.10表单的设计2.10.1表单标记<form>表单在Web网页中用来给访问者填写信息，从而能采集客户端信息，使网页具有交互的功能。一般是将表单设计在一个Html文档中，当用户填写完信息后做提交(submit)操作，于是表单的内容就从客户端的浏览器传送到服务器上，经过服务器上的ASP或CGI等处理程序处理后，再将用户所需信息传送回客户端的浏览器上，这样网页就具有了交互性。表单是由窗体和控件组成的,一个表单一般应该包含用户填写信息的输入框,提交和按钮等，这些输入框,按钮叫做控件,表单很像容器,它能够容纳各种各样的控件。一个表单用<form></form>标志来创建。也即定义表单的开始和结束位置，在开始和结束标志之间的一切定义都属于表单的内容。<form>标志具有action、method和target属性。表单标签的格式:<FORMaction＝“url”method=get|postname=“myform”target=“_blank”>...</FORM>(代码2-33.html)2.11Javascript基础2.11.1JavaScript简介1.JavaScript特点JavaScript使网页增加互动性。JavaScript能及时响应用户的操作，对提交表单做即时的检查，无需浪费时间交由CGI验证。JavaScript的特点是无穷无尽的，只要有创意。2.Java与JavaScript的区别很多人看到Java和JavaScript都有“Java”，就以为它们是同一样东西，其实它们是不同的两种东西。3.开发JavaScript使用的软件一个JavaScript程序其实是一个文档，一个文本文件。它是嵌入到HTML文档中的。所以，任何可以编写HTML文档的软件都可以用来开发JavaScript。2.11.2JavaScript语言的基础1.在什么地方插入JavaScriptJavaScript可以出现在HTML的任意地方。使用标记<script>…</script>，可以在HTML文档的任意地方插入JavaScript，甚至在<HTML>之前插入也不成问题。不过如果要在声明框架的网页（框架网页）中插入，就一定要在<frameset>之前插入，否则不会运行。基本格式：<script>...(JavaScript代码)...</script>另外一种插入JavaScript的方法，是把JavaScript代码写到另一个文件当中（此文件通常应该用“.js”作扩展名），然后用格式为“<scriptsrc="javascript.js"></script>”的标记把它嵌入到文档中。注意，一定要用“</script>”标记。参考：<script>标记有一个属性：language（缩写lang），说明脚本使用的语言。对于JavaScript，请用“language="JavaScript"”。参考：相对于<script>标记，还有一个<server>标记。<server>标记所包含的，是服务器端（ServerSide）的脚本。如果想在浏览器的“地址”栏中执行JavaScript语句。格式如下：javascript:<JavaScript语句>这样的格式也可以用在链接中：<ahref="javascript:<JavaScript语句>">...</a>2.JavaScript基本语法每一句JavaScript都有类似于以下的格式：<语句>;其中分号“;”是JavaScript语言作为一个语句结束的标识符。虽然现在很多浏览器都允许用回车充当结束符号，培养用分号作结束的习惯仍然是很好的。语句块是用大括号“{}”括起来的一个或n个语句。在大括号里边是几个语句，但是在大括号外边，语句块是被当作一个语句的。语句块是可以嵌套的，也就是说，一个语句块里边可以再包含一个或多个语句块。3.JavaScript中的变量从字面上看，变量是可变的量；从编程角度讲，变量是用于存储某种/某些数值的存储器。所储存的值，可以是数字、字符或其它的一些东西。变量的命名有以下要求：只包含字母、数字和/或下划线；要以字母开头；不能太长，不超过256个字符；不能与JavaScript保留字（KeyWords，ReservedWords等凡是可以用来做JavaScript命令的字）重复。变量是区分大小写的，例如，variable和Variable是两个不同的变量。4.表达式与运算符表达式与数学中的定义相似，表达式是指具有一定的值的、用运算符把常数和变量连接起来的代数式。一个表达式可以只包含一个常数或一个变量。运算符可以是四则运算符、关系运算符、位运算符、逻辑运算符、复合运算符。5.语句下面将开始讨论JavaScript基本编程命令，或者叫“语句”，例如注释，if语句、循环语句、选择语句等等。（1）注释。（2）选择语句if语句switch语句（3）循环体for循环while循环break和continue实训一HTML标记语言一、实训目的和要求能够使用HTML语言设置文本格式和列表格式能够使用HTML语言插入图像和创建表格能够使用HTML语言创建表单和表单对象二、实训环境与器材硬件环境：多媒体计算机电脑一台软件环境：WindowsXP操作系统；JDK环境；三、实训步骤与结果1．在网页中设置文本的字体、字号和颜色2．在网页中插入一幅图像，然后设置该图像的格式3．在网页中创建一个表格并设置表格、行、单元格的属性4．在网页中创建一个表单，并在该表单中包含文本框、密码框、滚动文本框、单选按钮、复选框、提交按钮和重置按钮等控件2.13本章小结通过本章的学习，读者对HTML有了一些了解。本章介绍了HTML的基本知识，包括HTML的基本结构、文字、图像、表格及多媒体的插入等标签的使用方法，并从中知道HTML标记是一个成对出现的闭合结构。还学习了javascript语言的基本使用方法和技巧。在今后的学习中会反复用到这些知识，请读者最好对HTML标记和javascript语言勤加练习，达到灵活应用的目的。下一章，将进入Dreamweaver的学习。2.14练习与提高
浙公网安备 33021202002483