电子商务网站建设之HTML语言高级

1、电子商务网站建设第4章 html语言高级4.1 创建超链接4.2 创建表格4.3 创建表单4.4 帧标签4.5 分区标签2/5/20221电子商务网站建设超链接标签超链接标记的格式如下：超链接文本或图像超链接标记除了必备的href属性外，还有一个属性target，它指明目标页面显示的窗口jtarget的默认值是本页面所在的浏览器窗口jtarget=_blank表示目标页面显示于一个新的浏览器窗口中jtarget=_top表示目标页面显示于整个浏览器窗口中，而不是显示在帧所在窗口中jtarget=帧名表示目标页面显示于指定帧所在的窗口中2/5/20222电子商务网站建设2/5/20223电子商务

2、网站建设超链接标签根据目标页面的位置不同，href属性的url信息构成分为以下3种情况：j目标页面位于另外的主机或采用非http协议，此时url采用绝对路径，即使用如下格式：协议名:/主机名/目录信息 j若目标页面位于本主机，此时url采用相对路径：超链接文本或超链接文本j超链接的目标不仅可以指向html文件的头部，也可以指向某个文件的特定位置（称为“锚点”，anchor），其格式如下：文本或图像等页面元素2/5/20224电子商务网站建设2/5/20225电子商务网站建设创建表格表格标签标题内容 表格内标题 表格内容 表格内容 2/5/20226电子商务网站建设表格标签创建表格创建表格中的一

3、行，一般包括一个或多个列元素创建表格中的一列标签，定义表格的标题可以是表格中的第一个标签，作为表格内的标题行2/5/20227电子商务网站建设标签的属性2/5/20228电子商务网站建设标签的属性2/5/20229电子商务网站建设标签的属性2/5/202210电子商务网站建设例3.10 若要在网页上显示如下效果的表格，考虑该如何设计html文件代码查看源代码2/5/202211电子商务网站建设利用表格进行网页布局表格标签除了绘制文本表格外，还经常用来进行网页布局。表格是最常用的页面元素，可以用来固定文本或图像的显示位置。通常我们使用、标记及其属性对网页内容进行分块显示。在internet上浏览

4、的许多页面都大量使用了表格，很多较复杂的页面布局就是利用表格来完成的。2/5/202212电子商务网站建设例3.12 使用表格标签设计如下页面结构。查看源代码2/5/202213电子商务网站建设例3.13 试用html表格结构设计如下网站截图的右下角目录部分。查看源代码2/5/202214电子商务网站建设利用表格进行网页布局2/5/202215电子商务网站建设什么是表单？2/5/202216电子商务网站建设什么是表单？表单是实现图形用户界面的基本元素，它包括按钮、文本框、单选框、复选框等，它们是html实现交互功能的主要接口。用户通过表单向服务器提交数据。表单的使用包括两个部分：一部分是用户界

5、面，提供用户输入数据的元件；另一部分是处理程序，可以是客户端程序，在浏览器中执行；也可以是服务器处理程序，处理用户提交的数据，返回处理结果。2/5/202217电子商务网站建设表单的定义定义表单的语法如下： textarea定义 select定义 标签对用来创建一个表单，即定义表单的开始和结束位置，具有action、method、target、title、enctype等属性。2/5/202218电子商务网站建设表单的输入域不同类型的输入域为用户提供灵活多样的数据输入方式。表单的输入域有如下3大类：j以标记定义的多种输入域，包括text，radio，checkbox，password，hidd

6、en，button，submit和reset等。j以标记定义的文本域。j以标记和定义的下拉列表框。2/5/202219电子商务网站建设常用的表单输入域2/5/202220电子商务网站建设表单输入标记标记在表单中使用频繁，大部分表单内容需要用到此标记。其语法如下： 其中value：用于设定表单默认值；checked：表示选择框中，此项被默认选中；maxlength：表示在输入单行文本的时候，最大允许字符数；size：用于设定表单框的尺寸；onclick：表示在按下按钮时调用指定的子程序；onselect：表示当前项被选择时调用指定的子程序。2/5/202221电子商务网站建设标签举例姓名：密码：

7、性别：男 女兴趣爱好： 音乐 运动 看书2/5/202222电子商务网站建设例3.14 一个简单的标签实例标签举例姓名：密码：性别：男 女兴趣爱好： 音乐     运动     看书     上网     旅游    2/5/202223电子商务网站建设标签用标记可以在表单中插入一个下拉菜单，其语法如下：表项内容 表项内容 其中name：设定下拉菜单的名称；size：设定菜单框的高度，也就是一次显

8、示几个菜单项；multiple：是可选项，若定义该属性，则下拉列表中的内容允许进行多选。 2/5/202224电子商务网站建设标签举例例3.15 下拉菜单举例标签举例请选择你所在的年级： 大一 大二 大三 大四2/5/202225电子商务网站建设将下面两个例子分别与例3.15进行比较例3.16标签举例请选择日期： 星期日 星期一 星期二 星期三 星期四 星期五 星期六 例3.17标签举例请选择你喜欢的球类运动： 足球 篮球 排球 乒乓球 羽毛球 台球 网球2/5/202226电子商务网站建设标签标签中包含了多个标签，标签有两个常用的属性：value和selectedjvalue用来指定控制操作

9、的初始值，缺省时初值为option的内容jselected设定时表明该项内容被预置2/5/202227电子商务网站建设标签举例例3.18 一段简单的包含下拉菜单的页面代码，注意标签的属性请选择你最喜欢的颜色： -放弃选择- 红色 黄色 蓝色 绿色 紫色 黑色 白色2/5/202228电子商务网站建设标签j在表单中创建一个能够输入多行文本的文本框j属性：cols(列数)，rows(行数)，单位是字符数标签语法如下：此处显示在文本框外的提示信息此处显示在文本框里的预留信息2/5/202229电子商务网站建设例3.19 一段简单的包含多行文本框的页面代码 您的意见对我很重要： 请将您的建议输入到此区

10、域 2/5/202230电子商务网站建设帧标签框架(frame)又常被称为帧，利用框架可以将浏览器显示窗口分割成多个相互独立的区域，每个区域可以显示独立的html页面。以下是使用框架的一个简例查看代码2/5/202231电子商务网站建设帧标签框架的定义较为特殊，首先确定如何划分窗口，然后建立描述窗口分割的主文件，再为每个框架建立相应的html文件。主文件的定义方法：头部标记. 字符串2/5/202232电子商务网站建设标签的属性2/5/202233电子商务网站建设标签的属性2/5/202234电子商务网站建设例3.21 设计如图所示的框架页面，利用帧标签将页面分成3个子窗口。查看代码2/5/202235电子商务网站建设分区标签区域标签，用于将若干相邻的html元素组合成一个区域块，对的操作就应用于这个区域内的所有html标签。例如要将某段落（文本或图片）的内容全部居中显示，只需用设置组合，添加一个align=center即可，无需逐个设置。在各段落中起始段落前设置，结束段落后设置即可。分区标签在网页设计中的应用非常频繁，留意网页中部分块结构的统一对齐显示，尤其是整个网页内容的居中显示。2/5/202236电子商务网站建设分区标签举例例3.22 一个简单的分区标签的应用分区标签效果演示段落1段落2段落3其中标签中的代码等价于:段落1段落2段落32/5/202237