《上HTML标记》PPT课件.ppt

第三章第三章 HTML标记功能详述标记功能详述 本章要点本章要点p文本格式标记文本格式标记p文本修饰标记（字体标记）文本修饰标记（字体标记）p列表标记列表标记 p超链接标记超链接标记p图像和多媒体标记图像和多媒体标记HTML标记基础标记基础p2.什么是标记什么是标记？标记是网页文档中的一些有特定意义的符号。标记是网页文档中的一些有特定意义的符号。这些符号指明如何显示文档中的内容。这些符号指明如何显示文档中的内容。标记可以具有相应属性即各种参数，如标记可以具有相应属性即各种参数，如size、color、text、width和和noshade等等。例如：例如：文本格式标记文本格式标记网页中添加文本的方法网页中添加文本的方法网页中添加文本的方法网页中添加文本的方法 文本格式标记是网页中定义文本格式的标记文本格式标记是网页中定义文本格式的标记1）直接写文本；）直接写文本；2）用段落标记）用段落标记格式化文本，各段落格式化文本，各段落文本将分行显示；文本将分行显示；3）用标题标记）用标题标记格式化文本，作用：格式化文本，作用：定义第定义第n号标题字体，号标题字体，n=16，n值越大，字越小；值越大，字越小；文本将变为粗体显示，可看成特殊的段落标记；文本将变为粗体显示，可看成特殊的段落标记；4)用预格式化标记用预格式化标记格式化文本，格式化文本，标记内的文本将按原来的格式显示，保留文本标记内的文本将按原来的格式显示，保留文本中的所有空格、换行和定位符；中的所有空格、换行和定位符；直接写文本直接写文本 电子商务专业学习电子商务专业学习 网页网页设计课程概述设计课程概述电子商务专业学习网页设计的意义电子商务专业学习网页设计的意义电子商务顾名思义就是在电子商务顾名思义就是在internet上做生意，上做生意，商品展示，广告宣传、发布商品展示，广告宣传、发布用段落标记用段落标记格式化文本格式化文本  电子商务顾名思义就是电子商务顾名思义就是在在internet上做生意，商品展示，广告宣上做生意，商品展示，广告宣传、发布供求信息等活动实现的途径就是传、发布供求信息等活动实现的途径就是网页。网页。因此学习网页设计技术是从事电子商务因此学习网页设计技术是从事电子商务活动的基石。活动的基石。用标题标记用标题标记格式化文本格式化文本第第1号标题字体号标题字体 第第3号标题字体号标题字体 第第4号标题字体号标题字体 第第5号标题字体（居号标题字体（居中）中）用预格式化标记用预格式化标记格式文本格式文本 网页设计师这一职业在今后来说网页设计师这一职业在今后来说还是有需求的。还是有需求的。因为随着网络越来越普及，因为随着网络越来越普及，像我国的房地产市场像我国的房地产市场文本的强制换行文本的强制换行电子商务顾名思义就是在电子商务顾名思义就是在internet上做生意，上做生意，商品展示，广告宣传、发布商品展示，广告宣传、发布供求信息等活动实现的途径就是网页。供求信息等活动实现的途径就是网页。p强制不换行标记强制不换行标记，常，常用于一串数字用于一串数字 文本中的空格文本中的空格p标记标记(除外除外)内内字符前的空格字符前的空格浏览器浏览器将全部忽略，将全部忽略，字符与字符间的空格字符与字符间的空格浏览器浏览器将只保留一个空格显示，将只保留一个空格显示，回车回车视为一个空视为一个空格，块级元素之间忽略所有空格。如果要格，块级元素之间忽略所有空格。如果要输入多个空格或需要在字符之前输入空格输入多个空格或需要在字符之前输入空格需在源代码中插入需在源代码中插入&nbspnbsp;（表示一个半角（表示一个半角空格）。空格）。p行内元素可看成一个字符行内元素可看成一个字符 文本中的转义字符文本中的转义字符p在在HTML源代码中，有些字符有特别的含义，源代码中，有些字符有特别的含义，比如小于号比如小于号“”就表示就表示HTML 标记的开始，标记的开始，html源代码中的源代码中的“”是不会在浏览器中显示的，是不会在浏览器中显示的，如果要浏览器显示这些字符，就需要输出他们如果要浏览器显示这些字符，就需要输出他们对应的转义字符。对应的转义字符。p例如：例如：<表示表示,&quot表示表示“,&表示表示&, 表示空格等；表示空格等；通常，一个字符实体是由三部分组成的：通常，一个字符实体是由三部分组成的：（1）一个）一个“&”符号符号（2）字符专用名称或者字符代号）字符专用名称或者字符代号（3）一个）一个“;”符号符号在在DW的设计视图中输入这些特殊字符，的设计视图中输入这些特殊字符，DW会自动在代会自动在代码视图添加它们对应的转义字符码视图添加它们对应的转义字符DW中插入中插入HTML文本元素的快捷键文本元素的快捷键 1.Enter 插入插入 （硬回车）（硬回车）2.shiftenter 插入插入 （软回车）（软回车）3.Ctrlshiftspace 插入一个插入一个 综合实例综合实例 分段换行与预格式分段换行与预格式 以下是直接写文本的情况：以下是直接写文本的情况：星期一、星期二、星期三、星期四、星期一、星期二、星期三、星期四、星期五、星期六、星期日。星期五、星期六、星期日。以下是使用了三个换行标记的情况：以下是使用了三个换行标记的情况：星期一、星期二、星期一、星期二、/星期三、星期四、星期三、星期四、/星期五、星期六、星期日。星期五、星期六、星期日。/以下使用分段标记（分为两段）：以下使用分段标记（分为两段）：星期一、星期二、星期三、星期一、星期二、星期三、星期四、星期四、星期五、星期六、星期日。星期五、星期六、星期日。以下使用预格式：以下使用预格式：星期一、星期二、星期三、星期四、星期一、星期二、星期三、星期四、星期五、星期六、星期日。星期五、星期六、星期日。跑马灯跑马灯标记标记p一个特殊的文本标记，能使其中的文本在一个特殊的文本标记，能使其中的文本在浏览器屏幕上不断滚动。浏览器屏幕上不断滚动。示例示例p其中其中behavior=“alternate”设置滚动方式为设置滚动方式为来回滚动，设置为来回滚动，设置为scroll表示循环滚动，表示循环滚动，设置为设置为slide表示滚动到目的地就停止。表示滚动到目的地就停止。direction属性用于控制滚动的方向，可以属性用于控制滚动的方向，可以上下滚动或左右滚动。上下滚动或左右滚动。loop设置滚动的次设置滚动的次数，数，loop为为0表示不断滚动。表示不断滚动。scrollamount属性设置滚动的速度，属性设置滚动的速度，scrolldelay属性设属性设置两次滚动间的间隔时间。置两次滚动间的间隔时间。示例示例  测试测试:网页设计与网页设计与制作学习：可以将制作学习：可以将swf文件下载下来用文件下载下来用flash播放播放器全屏播放以达到最好效果，也可以在器全屏播放以达到最好效果，也可以在IE浏览浏览器中按器中按F11键达到全屏效果键达到全屏效果.水平线标记水平线标记 p标记是在标记是在HTML文档中加入一条水文档中加入一条水平线，它可以直接使用，具有平线，它可以直接使用，具有size、color、width和和noshade属性。属性。size是设置水平线是设置水平线的厚度，而的厚度，而width是设定水平线的宽度，是设定水平线的宽度，默认单位是像素。默认单位是像素。noshade属性用来加入属性用来加入一条没有阴影的水平线。一条没有阴影的水平线。p文本修饰标记（字体标记）文本修饰标记（字体标记）文本修饰标记文本修饰标记p文本修饰标记是对文本的外观进行修饰的标记，文本修饰标记是对文本的外观进行修饰的标记，如让文字变色，加大，变粗体，添加下划线等。如让文字变色，加大，变粗体，添加下划线等。p1）font标记：标记：定义文字的各种属性。定义文字的各种属性。例：例：pp注意：文本修饰标记没有注意：文本修饰标记没有align属性属性(说明说明）加粗、倾斜与下划线标记加粗、倾斜与下划线标记p2）加粗、倾斜与下划线的定义标记（）加粗、倾斜与下划线的定义标记（b、i、u）使用加粗、倾斜与下划线标记（使用加粗、倾斜与下划线标记（b、i、u）的）的组合组合，可对文本文字进一步修饰。可对文本文字进一步修饰。如：如：此处以红色此处以红色五号字粗体显示五号字粗体显示上标（上标（sup）和下标（）和下标（sub）标记）标记 p用于书写数学公式或分子式。用于书写数学公式或分子式。p如：如：H2O X2p由于字体标记属于对文本由于字体标记属于对文本外观外观进行修饰的进行修饰的标记，是由于当时标记，是由于当时CSS语言尚未出现时语言尚未出现时html定义的表现的范畴，随着定义的表现的范畴，随着CSS的出现，的出现，这些表现功能均可以由这些表现功能均可以由CSS完成，所以不完成，所以不含有语义的字体标记慢慢过时了。含有语义的字体标记慢慢过时了。列表标记列表标记 列表标记列表标记p为了合理地组织文本，网页中常常要用到为了合理地组织文本，网页中常常要用到列表。在列表。在HTML中可以使用的列表标记有中可以使用的列表标记有无序列表、有序列表和定义列表三种。无序列表、有序列表和定义列表三种。p无序列表无序列表(Unordered List),p有序列表有序列表(Ordered List),p定义列表定义列表(Defined List),嵌套的无序列表示例嵌套的无序列表示例 文章文章 CSS教程教程 DOM教程教程 XML教程教程 参考参考 XHTML XMLCSS 有序列表有序列表(Ordered List)文章文章 CSS教程教程 DOM教程教程 XML教程教程 Flash教程教程 定义列表定义列表(Defined List)湖南城市湖南城市长沙长沙衡阳衡阳常德常德 湖北城市湖北城市武汉武汉襄樊襄樊宜昌宜昌超链接标记超链接标记 超链接标记超链接标记 p超链接是网页的基本元素，网页正是通过超链接是网页的基本元素，网页正是通过超链接而相互链接组织成一个网站，并将超链接而相互链接组织成一个网站，并将internet上的各个网站联系在一起。浏览上的各个网站联系在一起。浏览者通过超链接选择阅读路径。者通过超链接选择阅读路径。p超链接是通过超链接是通过URL（统一资源定位器）来（统一资源定位器）来定位目标信息的。定位目标信息的。URL包括包括4部分：网络部分：网络协议、域名或协议、域名或IP地址、路径和文件名。地址、路径和文件名。pURL分为绝对分为绝对URL和相对和相对URL 绝对绝对URL p 绝对绝对URL是采用完整的是采用完整的URL来规定文件来规定文件在在internet上的精确地点，包括完整的协上的精确地点，包括完整的协议类型、计算机域名或议类型、计算机域名或IP地址、包含路径地址、包含路径信息的文档名。书写格式为：协议：信息的文档名。书写格式为：协议：/计计算机域名或算机域名或IP地址地址/文档路径文档路径/文档名文档名p例如：例如：http:/ p相对相对URL是相对于包含超链接页的地点来规定文是相对于包含超链接页的地点来规定文件的地点。件的地点。p如链接到同一路径下的文档，直接输入文件名即如链接到同一路径下的文档，直接输入文件名即可，如可，如news.htmp如链接到同一路径下子文件夹的文档，则先输入如链接到同一路径下子文件夹的文档，则先输入子文件夹名和斜杠（子文件夹名和斜杠（/），再输入文件名，如），再输入文件名，如yule/news.htmp如链接到上一级路径中，要在文件名前输入如链接到上一级路径中，要在文件名前输入“./”，如，如“./news.htm”，其中，其中“.”表示表示上级目录，上级目录，“.”表示本级目录。表示本级目录。相对相对URL示例示例wgzxyuleindex.htmoa.htmpop.htmnews.htm1.href=yule/news.htm212.href=./oa.htm3.href=“pop.htm”3相对相对URL的优势的优势p可以看出相对可以看出相对URL方式比较简便，不需输方式比较简便，不需输入一长串完整的入一长串完整的URL；另外相对路径还有；另外相对路径还有一个非常重要的特点是：可以毫无顾忌地一个非常重要的特点是：可以毫无顾忌地修改修改Web网站的域名或网站在服务器硬盘网站的域名或网站在服务器硬盘中的存放目录。中的存放目录。超链接的种类根据源对象划分超链接的种类根据源对象划分 1)用文本做超链接用文本做超链接：首页首页2)用图像做超链接：用图像做超链接：3)文本图像混合做链接：文本图像混合做链接：格力空调格力空调1型型该方法在商品展示的网站上较常用。该方法在商品展示的网站上较常用。使用图像做超链使用图像做超链接后，图像会自接后，图像会自动增加边框，可动增加边框，可设置边框为设置边框为0去掉去掉超链接的种类根据源对象划分超链接的种类根据源对象划分24)热区链接热区链接：使用：使用map在图像上定义一幅地图，地在图像上定义一幅地图，地图上可包含多个热区，每个热区用图上可包含多个热区，每个热区用area单标记定单标记定义，义，area的的shape属性定义了热区的形状，属性定义了热区的形状，coords定义了热区的坐标点，定义了热区的坐标点，href定义了热区链接的文定义了热区链接的文件。同时件。同时img标记用标记用usemap指明用了哪幅地图指明用了哪幅地图 超链接的种类根据超链接的种类根据href的取值的取值1)链接到其他网页或文件链接到其他网页或文件（jpg,rar等）等）内部链接内部链接返回首页返回首页外部链接外部链接 网易网网易网站站 下载链接下载链接点击下点击下载载2)电子邮件链接电子邮件链接给我留言给我留言如果如果IE不能打开该文不能打开该文件，则会弹出件，则会弹出文件文件下载下载的对话框的对话框超链接的种类根据超链接的种类根据href的取值的取值23)锚链接（链接到页面中某一指定的位置）锚链接（链接到页面中某一指定的位置）当当网网页页内内容容很很长长，需需要要进进行行页页内内跳跳转转链链接接时时，就就需需要要定定义义锚点和锚点链接，锚点可使用锚点和锚点链接，锚点可使用name属性或属性或id属性定义。属性定义。也可以链接到其他网页某个锚点处也可以链接到其他网页某个锚点处 4)空链接和脚本链接空链接和脚本链接:超链接的打开方式（超链接的打开方式（target属性的取值）属性的取值）p在本窗口打开：在本窗口打开：_self（target的默认值）的默认值）p在新窗口打开：在新窗口打开：_blankp在父窗口打开：在父窗口打开：_parent 将链接的文件载将链接的文件载入到父框架入到父框架p在整个窗口打开：在整个窗口打开：_top：将链接的文件载：将链接的文件载入到整个浏览器窗口中，并删除所有框架入到整个浏览器窗口中，并删除所有框架p_parent、_top仅仅在网页被嵌入到其他仅仅在网页被嵌入到其他网页中有效，如框架中的网页，所以这两网页中有效，如框架中的网页，所以这两种取值用得很少。种取值用得很少。超链接的超链接的title属性属性ptitle属性在很多标记里都有，其作用是在属性在很多标记里都有，其作用是在鼠鼠标标停留在停留在该该元素上元素上时显时显示示设设置的置的说说明文字明文字p如如格力太格力太阳能喜获阳能喜获…超链接制作的原则超链接制作的原则 1)可以使用相对链接尽量不要使用绝对链可以使用相对链接尽量不要使用绝对链接，如接，如./index.htm而不是而不是http:/2)链接目标尽可能简单链接目标尽可能简单如如http:/，而不是，而不是http:/ p图像标记图像标记：将图形文件嵌入到网页文档中的当前位置将图形文件嵌入到网页文档中的当前位置p说明：网页中插入图像有两种方法，一是说明：网页中插入图像有两种方法，一是插入一个插入一个元素，二是将图像作为背元素，二是将图像作为背景嵌入到网页中景嵌入到网页中p由于由于CSS的背景属性的功能很强大，现在的背景属性的功能很强大，现在更推荐将所有的图像都作为背景嵌入。如更推荐将所有的图像都作为背景嵌入。如果图像是通过果图像是通过元素插入，则可以在元素插入，则可以在浏览器上通过按住鼠标左键拖动选中图片，浏览器上通过按住鼠标左键拖动选中图片，或者将它拖动到地址栏里，如果作为背景或者将它拖动到地址栏里，如果作为背景嵌入，则无法选中图片嵌入，则无法选中图片图像标记图像标记网页中支持的图像文件格式网页中支持的图像文件格式 p网页中可以插入的图像文件的类型有网页中可以插入的图像文件的类型有jpg格式，格式，gif格式和格式和png格式。这些文件都是压缩格式的图格式。这些文件都是压缩格式的图像格式，其中像格式，其中jpg格式适合用于网页中较大尺寸格式适合用于网页中较大尺寸的的真彩色图片真彩色图片，是一种有损压缩的格式；，是一种有损压缩的格式；gif格格式一般用于较小尺寸的图片，是一种无损压缩式一般用于较小尺寸的图片，是一种无损压缩的格式，只支持的格式，只支持256色，色，GIF在存储非连续色调在存储非连续色调的图像或具有大面积单一色彩的图像方面比较的图像或具有大面积单一色彩的图像方面比较出色，出色，gif格式的特点是可以实现格式的特点是可以实现gif动画动画，和，和gif全透明的图像全透明的图像；png格式可以用于格式可以用于alpha透明效透明效果果，但，但IE6不能够支持。不能够支持。标记的常见属性标记的常见属性p是一个行内元素，插入是一个行内元素，插入元素不会导元素不会导致任何换行。下面是致任何换行。下面是标记的常见属性：标记的常见属性：img的属性的属性含含义义src图图片文件的片文件的url地址地址alt当当图图片无法片无法显显示示时显时显示的替示的替换换文字文字title鼠鼠标标停留在停留在图图片上片上时显时显示的示的说说明文字明文字align图图片的片的对齐对齐方式，默方式，默认为认为基基线对齐线对齐，即，即图图片的下片的下边缘边缘和文字的下和文字的下边缘对齐边缘对齐width、height图图片在网片在网页页中的中的宽宽和高和高在单元格中插入图像的方法在单元格中插入图像的方法 对于表格布局的网页，所有的元素都是放置在单对于表格布局的网页，所有的元素都是放置在单元格中的，图像也不例外，要在单元格中插入元格中的，图像也不例外，要在单元格中插入图像，且单元格的边框和图像之间没有间隙。图像，且单元格的边框和图像之间没有间隙。那么必须将该单元格的宽和高设置为图片的宽那么必须将该单元格的宽和高设置为图片的宽和高，且表格中其它单元格的大小也必须固定，和高，且表格中其它单元格的大小也必须固定，然后确保然后确保与与之间只有之间只有标记，标记，没没有空格和换行符有空格和换行符，否则单元格会被空格撑开。，否则单元格会被空格撑开。如：如：!-不能换不能换行行-插入图像的对齐方式插入图像的对齐方式 p标记的对齐方式仍然通过标记的对齐方式仍然通过align属性属性实现，但其取值多达实现，但其取值多达9种，其中要实现图种，其中要实现图片和文本混排可使用片和文本混排可使用“左对齐左对齐”或或“右对右对齐齐”，要实现文本和图片顶部对齐可使用，要实现文本和图片顶部对齐可使用“文本上方文本上方”。p，但通常是将，但通常是将图片放在表格里，通过表格定位来实现文图片放在表格里，通过表格定位来实现文本和图像的混排。本和图像的混排。媒体元素插入标记媒体元素插入标记 插入插入flash的两种方法的两种方法 p方法一：执行菜单命令方法一：执行菜单命令：“插入媒体插入媒体flash”，在代码视图中可看到插入，在代码视图中可看到插入flash元元素是通过同时插入素是通过同时插入object标记和标记和embed标标记实现的，以确保在记实现的，以确保在IE5和和Firefox中都获中都获得应有的效果得应有的效果 p方法二：执行菜单命令：方法二：执行菜单命令：“插入媒体插入媒体插件插件”，此方法在代码视图中仅插入了，此方法在代码视图中仅插入了embed元素。由于元素。由于IE6和和Firefox都能正常都能正常显示效果，而代码更简洁，所以推荐用这显示效果，而代码更简洁，所以推荐用这种方式种方式 在图像上添加透明在图像上添加透明flash p首先可以将一张需要放置透明首先可以将一张需要放置透明flash的图片作为的图片作为单元格的背景导入，然后在此单元格内插入一单元格的背景导入，然后在此单元格内插入一个透明个透明flash文件，可以调整此文件，可以调整此flash元素的大小元素的大小与单元格相一致，选中该与单元格相一致，选中该flash文件，点击属性文件，点击属性面板里的面板里的“参数参数”按钮，新建一个参数按钮，新建一个参数“wmode”值设置为值设置为“transparent”。插入视频或音频文件插入视频或音频文件 插入视频可分别使用插入视频可分别使用ActiveX按钮或插件按钮实现按钮或插件按钮实现 ActiveX 方式方式 插件方式插件方式流媒体简介流媒体简介p流媒体实际指的是一种新的流媒体实际指的是一种新的媒体传送方式媒体传送方式，而，而非一种新的媒体非一种新的媒体,流式传输方式将整个多媒体文流式传输方式将整个多媒体文件经过特殊的压缩方式分成一个个件经过特殊的压缩方式分成一个个压缩包压缩包，由，由视频服务器向用户计算机连续、实时传送。在视频服务器向用户计算机连续、实时传送。在采用流式传输方式的系统中，用户不必像采用采用流式传输方式的系统中，用户不必像采用下载方式那样等到整个文件全部下载完毕下载方式那样等到整个文件全部下载完毕p常见的流媒体文件格式常见的流媒体文件格式preal公司：公司：rmrmvbra papple公司：公司：quicktimemov pmicrosoft公司：公司：asfwmvwma 插入流媒体元素的方法插入流媒体元素的方法p网页中插入流媒体也能向插入一般媒体一样使网页中插入流媒体也能向插入一般媒体一样使用用embed标记，只是要在标记，只是要在classId框中设置流媒体框中设置流媒体的类型的类型插入插入Real Player流格式的视频文件流格式的视频文件 属性面板中设置属性面板中设置:ClassID为为RealPlayer。选中选中Embed复选框。复选框。Src为为zhaodan.rm。单击单击“参数参数”按钮，设置属性。按钮，设置属性。parm参数示例参数示例p参数：参数：console 属性：可以将各种不同的属性：可以将各种不同的RealPlayer控制聚集在网页上，这样它们控制聚集在网页上，这样它们可以交互使用或是保持独立，而且互相不可以交互使用或是保持独立，而且互相不影响影响 演示演示phttp:/59.51.24.41:8000/ec/youhua/kclx-1.htm 假如图形文件放在网页文档所在目录的上层目录(如home)下，则相对路径就必须是准网址，即用“./”表示网站，后边紧跟文件在网站中的路径。例如，home是网站下的一个目录，则代码应为：。例如，home是网站下的目录king下边的一个子目录，则代码应为：。HTML基础基础 例2-6 图像标记举例图像标记示例 HTML基础基础若事先在网站根目录中存放一幅图像logo468_60.gif，则可以在网页中显示它。alt=网页制作属性表示在网页中可以用文字网页制作代替该图像先行显示出来。（2）多媒体标记 A.设置音乐播放的链接设置音乐播放的链接 在Windows中，可播放的音乐文件格式常有au、mid及wav三种。若要提供音乐文件让浏览者播放，则可建立指向音乐文件的超链接。例如：甜美音乐 B.设置影像播放的链接设置影像播放的链接 常见的影像文件有mov、mpg和avi。可建立超链接到影像文件。当浏览者单击超链接时，将会调用Windows Media Player，进行影像文件播放。例如：本市交通 HTML基础基础 C.C.直接将音乐或影像嵌入网页直接将音乐或影像嵌入网页 可以用标记，即:若“播放次数”设为TRUE，则无限次播放，直到单击关闭或停止。若设为NO（默认值），则只播放一次。D.D.播放网页背景音乐播放网页背景音乐 可运用标记，即：若“次数”设为Infinite，音乐将循环播放，直到网页关闭为止。HTML基础基础 6.表格标记（用于制作表格或网页结构）（1）（创建一个表格）（2）和（创建表格中的每一行和每一格）（3）（创建表格头）。例2-7 用表格标记创建下列表格。HTML基础基础 表格标记示例表格标记示例意意 大大 利利英英 格格 兰兰西西 班班 牙牙HTML基础基础cellpadding设置格子边框与其内容之间的大小；valign是垂直对齐方式；colspan设置一个格子跨占的列数；rowspan设置一个格子跨占的行数。AC米兰米兰佛罗伦萨佛罗伦萨曼联曼联纽卡斯尔纽卡斯尔巴塞罗那巴塞罗那皇家社会皇家社会HTML基础基础尤文图斯尤文图斯桑普多利亚桑普多利亚利物浦利物浦阿申纳阿申纳皇家马德里皇家马德里HTML基础基础拉齐奥拉齐奥国际米兰国际米兰切尔西切尔西米德尔斯堡米德尔斯堡马德里竞技马德里竞技HTML基础基础 7.表单标记（用于制作对话框）（1）（表单开始和结束标记）（2）（输入区标记）（3）（列表框标记）（4）（多行文本框标记）分别介绍如下：（1）标记用来创建一个表单，也即定义表单的开始和结束位置，在标记对之间的一切都属于表单的内容。HTML基础基础 标记具有action、method和target属性。action的值是处理程序的程序名。例如：，当 用 户 提 交 表 单 时，服 务 器 将 执 行 网 站http:/ GET 或 POST。GET方式是程序从当前网页文档中获取数据，然而这种方式传送的数据量是有所限制的，一般限制在1KB以下。POST方式与GET方式相反，它是当前网页文档把数据传送给处理程序，传送的数据量要比使用GET方式大得多。target用来指定显示表单的目标窗口。HTML基础基础 （2）标记用来定义一个用户输入区，用户可在其中输入信息。此标记必须放在标记对之间。标记中共提供文本框、按钮、复选框、单选钮等八种类型的输入区域。例如：HTML基础基础 （3）标记用来创建一个下拉列表框或可以复选的列表框。此标记对用于标记之间。具有multiple、name和size属性。例如：请选择最喜欢的男歌星:刘德华 张学友 郭富城 黎明 HTML基础基础标记指定列表框中的一个选项，此标记具有selected和value属性。value指定选项值，这个值要传送到服务器上。服务器正是通过调用区域的名字的value属性来获得该区域选中的数据项的。（4）标记创建可以输入多行的文本框，此标记对用于标记对之间。有name、cols和rows属性。name、cols和rows属性分别用来设置文本框的名称、列数和行数。列与行以字符数为单位。例如：HTML基础基础 例2-8 建立一个输入密码，以及具有确认和重输按钮的表单。请输入密码：HTML基础基础 8.其他常用标记 （1）空格标记&nbsp 建立HTML源文件时，若用空格键输入多个空格，都将被视为一个。因此，如果想要输入多个空格时，必须用多个标记&nbsp。（2）原始排版有效标记和 若要使HTML源文件保留原始的文件排版方式（如：Enter表示换行等），只需在该文本前加入标记以及在文本结束后加上标记，即可使浏览器显示文件原始排版方式。HTML基础基础 例如：在HTML源文件中使用空格标记&nbsp。标记使用实例信物     席慕容有谁会将诗集放在行囊里离去等待在独居的旅舍枕边 一页一页地翻开灯 熄 之 后    窗 里 窗 外HTML基础基础 （3）自动切换标记 标记能使网页显示几秒种后，自动切换到另一网页。语法如下：说明：A.标记应当置于标记之后;B.设置http-equiv属性等于”refresh”表示自动更新；C.“秒数；URL=文件名称或网址”用于指定几秒后将执行自动更新，以及更新后所连接的网页地址与名称。HTML基础基础