搜索
•第1章网页设计概述•第2章HTML语言基础•第3章Dreamweaver基础•第4章网页中的基础元素•第5章网页页面布局•第6章网页中的层和时间轴•第7章表单的应用•第8章在网页中使用行为•第9章CSS样式使用•第10章网页中的多媒体应用•第11章模板和库•第12章站点测试和发布•第13章Flash简介•第14章Fireworks简介$[知识目标]了解HTML文件的基本结构掌握HTML中文本的编辑及图像的语法掌握HTML中各种设置超级链接的语法掌握HTML中表格和框架的基本语法8[能力目标]掌握进行文本及图像的编辑操作掌握创建各种超级链接的操作能够编写简单的HTML网页掌握HTML文件中表格和框架的使用第2章HTML语言基础•2.1HTML概述•2.2文本的编辑•2.3图像编辑•2.4建立超链接•2.5表格与框架•本章小结第2章HTML语言基础2.1.1HTML简介2.1.2HTML语法结构2.1HTML概述去掉显示限制：!--savedfromurl=(0013)about:internet--HTML（HyperTextMarkupLanguage）又称超文本标识语言，是一种标识性的语言，是网页设计的最初语言。文件的扩展名:“html”或“htm”。例2.1简单的HTML文档htmlheadtitle长大欢迎您！/title/headbody这里是荆州旅游网，我们带您畅游荆州！/body/html由“”和“”组成的就是标记。在HTML语言中标记分“单标记”和“围堵标记”。2.1.1HTML简介2.1HTML概述1．围堵标记格式：标记应用对象/标记2．单标记格式：标记只有起始标记，没有结束标记。最常用的单标记是br,它表示段内换行。3．标记属性格式：标记属性1属性2属性3……各属性间无前后顺序，属性也可省略，当省略属性时取标记的默认值。2.1.1HTML简介2.1HTML概述HTML文档的基本结构：HTML文件开始HEAD标头区开始TITLE.../TITLE标题区/HEAD标头区结束BODY文件主体内容开始文件主体内容……/BODY文件主体内容结束/HTML文件结束其中HTML/HTML之间表示这是个网页文件，是必有的标记。注释标记：!--注释内容--不被显示出来2.1.2HTML语法结构2.1HTML概述实例•HTMLxmlns=•head•metahttp-equiv=Content-Typecontent=text/html;charset=gb2312/•title欢迎访问长江大学主页YangtzeUniversity----中央与湖北省共建、省属规模最大、学科门类最多的综合性大学/title•styletype=text/css•.STYLE11{FONT-SIZE:12px;color:#666666;}•/style•scripttype=text/JavaScript•!--•functionMM_jumpMenu(targ,selObj,restore){//v3.0•eval(targ+.location='+selObj.options[selObj.selectedIndex].value+');•if(restore)selObj.selectedIndex=0;•}•//--•/script•/head•body•tableborder=0cellspacing=0cellpadding=0width=100%height=100%id=table1•......•/table•......•/body•/HTML2.2.1段落标记2.2.2文本标记2.2.3标题显示等级2.2.4列表2.2文本的编辑1．段落（P）基本语法格式为：palign=left/center/right其中参数align用于设定段落的位置是靠左、靠右还是居中。默认值是靠左；除align之外p还有其他参数如class。class参数是可选项，如果没有将按照默认值显示。2．换行br，现在br/单标记，放在一行的末尾，可以在一个段落内实现文本的强制换行，设置标记后面的文本字、图像和表格等内容显示于下一行。2.2.1段落标记2.2文本的编辑1．字体标记font其基本语法格式为：fontface=？size=？color=？…/fontSize：设置字体的显示字号，范围是从“1～7”，size取1时最小，取7时最大。“3”是默认值。Color：设置文本的颜色，值可以是颜色名（英文如red代表红色）或颜色的十六进制RGB代码（#000000代表黑色，#FFFFFF代表白色）。Face：设置文本显示的字体，值为字体的名称。在文本的标记中还有很多常用的标记，比如表示字体效果的，b(黑体)，i（斜体），u（加下划线）。2.2.2文本标记2.2文本的编辑2．特殊字符HTML中除了我们上面学的的一些标记外，还有一些我们常用的特殊字符比如“”，这些特殊字符在HTML语言中都有对的转义符，常用的转义符与特殊字符参见下表：2.2.2文本标记HTML代码显示结果说明<小于号或显示标记>大于号或显示标记&&可用于显示其它特殊字符"引号®®注册©©版权™™商标 不断行的空格2.2文本的编辑3．水平线标记hr水平线是在网页上划出一条水平的分割线，用hr来标记水平线。语法格式为：hralign=left/center/rightsize=？width=？color=？noshadeSize：设置水平线的高度，以像素为单位。Color：设置水平线的颜色。Width：设置水平线的宽度，单位是像素或百分比，像素是绝对大小，不会随着程序窗口的大小而改，百分比是相对于程序窗口水平线所占的比例，会随着程序窗口的大小而改变。Align：设置水平线的对齐方式。对齐方式有左对齐，居中，右对齐三种。2.2.2文本标记2.2文本的编辑语法格式为：Hn标题文字/Hnn：表示不同级别的标题，n值可以是1-6中的任意数字，其中1表示的标题字体最大，6表示的标题字体最小。另外，可以用align属性设置对齐方式，常用的有三种：Hnalign=left|center|right标题文字/Hn属性align设置标题在页面中的对齐方式：左对齐left、居中center或右对齐right。缺省时默认为left。2.2.3标题显示等级2.2文本的编辑htmlheadtitle使用Hn标记/title/headbodyH1一级标题/H1H2二级标题/H2H3三级标题/H3H4四级标题/H4H5五级标题/H5H6六级标题/H6/body/html在HTML中，列表常用的有“有序列表”和“无序列表”。1．有序列表OL基本语法结构为：oltype=nstart=？li项目1li项目2……li项目n/ol2.2.4列表2.2文本的编辑1．有序列表OL参数解释Type：设置列表的序号类型，常用序号如下：n=1：用数字作为序号。n=A；用大写字母作为序号。n=a：用小写字母作为序号。n=I：用大写罗马数字作为序号。n=i：用小写罗马数字作为序号。Start：为可选参数，用于设置序号的起始数值。如不添加“start”则从每类序号的第一个序号开始。2.2.4列表2.2文本的编辑2．无序列表基本语法结构为：ultype=nli项目1li项目2……li项目n/ulType:设置符号形状，有实心圆、小正方形、空心圆三种，具体如下：n=disk：符号为实心圆。n=square：符号为正方形。n=circle：符号为空心圆。2.2.4列表2.2文本的编辑2.3.1插入图像2.3.2使用背景图像我们在网页上经常会浏览图像，适当使用图像可以增加网页的美观。在网页最常用到的是插入图像和设置背景图像。2.3图像编辑1．语法格式：imgsrc=url，单标记Src：指明要添加的图像所在的具体路径和文件名。路径可以是相对路径，也可以是绝对路径。例：imgsrc=images/ball.gif。绝对路径：完整的描述文件位置的路径就是绝对路径。对于绝对路径可以不需要知道其他任何信息就可以判断出文件的位置。相对路径：所谓相对路径,顾名思义就是当前文档与目标的相对位置。例src=1.bmp.2.3.1插入图像2.3图像编辑2．图像的属性除了“src”以外，img还有其他属性，可以定义图像的对齐方向，与周围元素的距离等，各属性及作用见表2.2。表2.2图像属性列表2.3.1插入图像名称作用border设定图像的边框vspace设定图像、文字与图像上下之间的间隔hspace设定图像、文字与图像左右之间的间隔width调整图像的宽度height调整图像的高度alt当浏览器无法显示图像时，会显示出alt属性所设定的文字2.3图像编辑语法格式为：bodybackground=url但通过Dreamweaver设置的背景已自动使用CSS处理：styletype=text/css!--body{background-image:url(../BG009.gif);}--/style2.3.2使用背景图像2.3图像编辑2.4.1建立超链接2.4.2使用书签2.4.3标记新窗口和基准链接2.4建立超链接超链接（Hyperlink）是网页互相联系的桥梁，超链接可以看作是一个“热点”，它可以从当前网页定义的位置跳转到其他位置，包括当前页的某个位置、本地硬盘或局域网上的其他文件以及因特网上其他服务器，甚至跳转到声音、图片等多媒体文件。建立超链接的标记是a，语法格式为：ahref=URLtarget=打开方式热点/aurl：指明链接目标的具体路径和文件名。热点=超链接标识：是网页中链接的载体，可以是文字或图像、热区等页面元素，用户点击它就会跳到超链接的目标位置。2.4.1建立超链接2.4建立超链接１．定义书签--超链接到网页中指定的位置在HTML中，首先要定义书签，然后才在链接使用。定义书签的语法格式为：aname=书签名书签名不能用中文，只能用英文和数字。２．使用书签链接其链接的格式为：ahref=#书签名超链接标识/a#与书签名之间不能有空格。2.4.2使用书签2.4建立超链接1．标记新窗口（target）语法格式为：ahref=urltarget=_blank超链接标识/atarget属可选值为：_blank（新窗口）、_self（覆盖本窗口）、_parent、_top。2．基准链接basebase标记是单标记，可以改变文件中所有链接标记的参数默认值。它只能位于文件的开头部分，即标记head与/head之间。语法格式为：basehref=url2.4.3标记新窗口和基准链接2.4建立超链接2.5.1建立表格2.5.2表格属性2.5.3建立框架2.5.4框架属性2.5表格与框架表格标记有table、th、tr和td四个，他们的具体含义是：table/table:定义表格,是表格必须的元素th/th：定义标题单元格，在这个单元格中的文字将用粗体表示。tr/tr：定义表格中的行。td/td：定义单元格，使用td标记一定要放在tr标记内部。上述标记中，th/th可以省略，其他三个是必须的。具体应用见例2.12。Table标记中可以添加属性和参数，其中border，用于设置表格的边框宽度，值为大于等于“0”的整数，当