web程序设计大作业.docx
- 文档编号:3895021
- 上传时间:2022-11-26
- 格式:DOCX
- 页数:14
- 大小:25.41KB
web程序设计大作业.docx
《web程序设计大作业.docx》由会员分享,可在线阅读,更多相关《web程序设计大作业.docx(14页珍藏版)》请在冰豆网上搜索。
web程序设计大作业
web程序设计课程考试大作业
姓名:
李德坤学号:
*************专业:
计算机1301班
题目3:
结合所学的课程内容,论述web程序设计的相关技术、应用及学习体会
1.HTML的主要知识点
框架是一种在一个浏览器窗口中显示多个HTML文件的网页制作技术。
框架基本结构
框架分为框架集和框架两部分。
定义框架的语法格式如下。
标记
HTML中用于描述功能的符号称为“标记”。
标记在使用时必须用尖括号“<>”括起来,比如、
、等,都是标记。多数标记必须成对出现,以开头无斜杠的标记开始,以有斜杠的标记结束。
标记还可以嵌套使用。
属性
与标记相关的特性称为属性,每个属性总是对应一个属性值,将其称为“属性/值”对。
“属性/值”对出现在开始标记的“>”之前。
在HTML文档中,标题(Heading)很重要。
标题是通过
-等6对标记进行定义的。
定义最大的标题,定义最小的标题。
font标记用于编辑网页文字的样式,主要是设置文字的字体、字号、颜色等属性。
font标记语法格式如下:
HTML的一些元素可以定义字体信息,如粗体、斜体等。
不论是在普通文档,还是在网页文字中,合理的使用段落会使文字的显示更加美观,要表
达的内容也更加清晰。
在HTML文件中,有专门的段落标记
。
粗体标记,被标记对括起的字词或句子在网页中表现为粗体。
斜体标记,被标记对括起的字词或句子在网页中表现为斜体。
下划线标记,被标记对括起的字词或句子在网页中表现为添加下划线效果。
删除线标记,被标记对括起的字词或句子在网页中表现为添加删除线效果,用于呈现
那些不再准确或不再相关的内容。
在HTML5中,更加提倡使用CSS样式表控制网页的格式。
使用CSS样式表可以实现更加丰
富的网页效果,更加精确的控制网页格式,定义和使用CSS也有很多种方法。
HTML还提供了列表,可以对网页文字进行更好的布局和定义。
所谓列表,就是在网页中将
项目有序或无序的罗列显示。
HTML中有3种列表形式:
有序列表、无序列表和自定义列表。
有序列表
- 列表信息
- 列表信息
- 列表信息
有序列表是一个项目的序列,各项目前标有数字表示顺序。
有序列表的语法格式如下。
……
无序列表
- 列表信息
- 列表信息
- 列表信息
无序列表也是一个项目的序列,不用数字而采用一个符号标志每个项目。
无序列表的语法格式如下。
……
自定义列表的语法格式如下。
- 名称
- 说明
- 名称
- 说明
- 名称
- 说明
……
图像标记
在制作网页过程中,可以使用HTML代码中的标记向网页中嵌入一幅图像,也可以使
用CSS设置成某元素的背景图像。
利用标记插入图像是网页中最常用的图像插入方式。
背景音乐标记
若打开浏览器的同时,希望伴随播放背景音乐,而不显示音乐播放器,可以在HTML文件中
使用
src属性用于指定背景音乐文件的地址或音乐文件名,音乐文件必须加上后缀名。
loop属性用于定义音乐播放的次数,可设置为任意正整数,若设为“-1”,音乐将永远循环。
通过
语法
格式如下。
behavior用来设置滚动方式
scrollamount用来设置滚动速度
scrolldelay属性来设置滚动文字的延迟时间
direction用来设置滚动方向
多媒体文件标记
要在网页中插入音频和视频文件以及Flash文件就要使用
HTML5中新增的视频标记
HTML5中新增音频标记
其语法格式如下。
定义超链接语法格式如下。
href属性定义了链接标题所指向的目标文件的URL地址。
target属性指定用于打开链接的目标窗口,默认方式是原窗口。
表单定义标记
输入标记
标记是表单中输入信息常用的标记,其语法格式如下。
数值输入域—number
语法格式如下。
列表框标记
在HTML文件中,使用列表框标记
实例
文本域输入标记
有时网页中需要一个多行的文本域,用来输入更多的文字信息,行间可以换行,并将这些信
息作为表单元素的值提交到服务器。
定义文本域的语法格式如下。
框架是一种在一个浏览器窗口中显示多个HTML文件的网页制作技术。
框架基本结构
框架分为框架集和框架两部分。
定义框架的语法格式如下。
2.CSS的主要知识点
CSS(CascadingStyleSheet)称为层叠样式表,也可以称为CSS样式表或样式表,其文件扩展名为.CSS。
CSS是用于控制网页样式,并允许将网页内容与样式信息分离的一种标记语言。
CSS的引入就是为了使HTML语言更好地适应页面的美工设计。
它以HTML语言为基础,提供了丰富的格式化功能,如字体、颜色、背景和整体排版等,并且网页设计者可以针对各种可视化浏览器来设置不同的样式风格。
选择器英文写作selector,在CSS中,根据选择器的功能或作用范围,将选择器主要分为标记选择器、类别选择器和ID选择器3种。
CSS可以认为是由多个选择器组成的集合,每个选择器由3个基本部分组成的—“选择器名称”、“属性”和“值”,格式如下。
selector{
property:
value;
}
一个HTML页面由很多不同的标记组成,例如
、
、等。标记选择器的格式定义如下。
tagName{
property:
value;
}
类选择器用来为一系列标记定义相同的呈现方式,语法格式如下。
.classValue{
property:
value
}
classValue是选择器的名称,具体名称由CSS制定者命名。
ID选择器和类选择器类似,都是对特定属性的属性值进行设置。
ID选择器和类选择器的区别是,一个HTML文件中只能使用一次某一ID的属性值。
定义ID选择器的基本语法格式如下。
#idValue{
property:
value;
}
在上面的语法格式中,idValue是选择器名称,可以由CSS定义者自己命名。
为了设置的CSS样式能够在网页中产生作用,必须将CSS和HTML文件联接在一起,才可以正常工作。
在HTML文件中使用CSS的方式有4种:
行内样式、嵌入式、链接式和导入式。
所谓并集选择器就是对多个选择器进行集体声明,多个选择器之间用“,”隔开,其中每个选择器可以是任何类型的选择器。
并集选择器的语法格式。
selector1,selector2,…{
property:
value;
}
在CSS选择器中,还可以通过嵌套的方式,对特殊位置的HTML标记进行控制。
后代选择器的写法是把外层的标记写在前面,内层的标记写在后面,之间用空格隔开,语法格式如下。
selector1selector2{
property:
value;
}
子选择器用于选中标记的直接后代(即儿子),它的定义符号是大于号(>),语法格式如下。
selector1>selector2
相邻(adjacent-sibling)选择器是另一个有趣的选择器,它的定义符号是加号(+),相邻选择器将选中紧跟在它后面的一个兄弟元素(这两个元素具有共同的父元素)。
在CSS中伪对象选择器主要有:
first-letter、:
first-line、:
before和:
after。
之所以称这些选择器是伪对象,是因为它们在效果上使文档增加了一个临时的元素,这是应用“虚构标记”的一个典型实例。
字体属性用于控制网页中文本字符的显示方式。
包括font,font-family,font-size,font-style,font-variant和font-weight等。
font-family属性
确定要使用的字体列表。
font-size属性
font-size属性用于控制文字的大小,它的取值分为4种类型:
绝对大小、相对大小、长度值以及百分数。
该属性的默认值是medium。
font-style属性
font-style属性确定指定元素显示的字形。
值包括normal、italic和oblique三种。
默认值为normal,表示普通字形;italic和oblique表示斜体字形。
font-variant属性
font-variant属性决定了浏览器显示指定元素的字体变体。
有三个值:
normal、small-caps和inherit。
font-weight属性
font-weight属性定义了字体的粗细值,它的取值可以是以下值中的一个:
normal、bold、bolder和lighter。
font复合属性
使用font属性可一次性设置前面介绍的各种字体属性(属性之间以空格分隔)。
在使用font属性设置字体格式时,字体属性名可以省略。
font属性的排列顺序是:
font-size倒手第二和font-family在最后,两者是必须出现的,而font-weight、font-variant、font-style三者在前面,循序无要求。
文本属性用于控制段落格式和文本的修饰方式,例如设置单词间距、字符间距、首行缩进、段落对齐方式等。
CSS中的常用文本属性包括word-spacing、letter-spacing、text-align、text-indent、line-height、text-decoration和text-transform等。
在CSS中,颜色属性可以用设来置元素内文本的颜色,而各种背景属性则可以控制元素的背景颜色以或背景图像。
color属性用来描述元素的前景颜色,CSS背景属性包括background、background-attachment、background-color、background-image、background-position和background-repeat等。
在HTML文档中可以直接通过标记来添加图片。
使用border、width、height等属性可以在HTML中调整图片。
使用CSS,可以为图片设置更加丰富的风格和样式,包括添加边框、缩放图片、实现图文混排和设置对齐方式等。
如果需要单独地定义边框一边的样式,可以使用border-top-style设定上边框样式、border-bottom-style设定下边框样式、border-right-style设定右边框样式和border-left-style设定左边框样式。
默认情况,网页上的图片按原始大小显示。
页面排版时,通常情况下还需要对图片的大小进行重新设定。
如果对图片设置不恰当,会造成图片的变形和失真。
设定图片大小,可以采用以下三种方式。
使用img的标记属性width和height
使用CSS3中max-width属性和max-height属性
使用CSS中width和height属性
网页效果的展示很多情况下都是通过图文混排来实现的。
使用CSS,可以设置多种不同的图文混排方式。
文字环绕
CSS使用float属性来实现该效果。
float语法格式如下。
float:
none/left/right;
其中none表示默认值对象不浮动,left表示文本流向对象的右边,right表示文本流向对象的左边。
3.JavaScript的主要知识点
JavaScript是一种脚本语言,是一种介于HTML与高级编程语言(Java、VB和C++等)之间的特殊语言。
脚本是一种能完成某些功能的小程序段,该程序段由一组可以在Web服务器或客户端浏览器运行的命令组成。
脚本语言可以嵌入HTML页面,并被浏览器解释执行。
使用脚本可以把网页对象和浏览器对象集成并组装起来,使网页具有动态效果和交互功能。
JavaScript是一种脚本语言,是一种基于对象的编程语言,JavaScript本身提供了非常丰富的内部对象供设计人员使用。
JavaScript是一种解释性编程语言,其程序由浏览器解释执行。
JavaScript的代码是一种文本字符格式,可以直接嵌入HTML文档中,并且可动态装载。
JavaScript程序的编写和运行
(1)启动DreamweaverCS5新建HTML文件。
(2)在
与标记中输入代码。(3)将文件保存为.html或.htm格式文件即可。
程序错误分为语法错误和逻辑错误两种。
语法错误是指在程序编写过程中使用不符合语言规则的语句,从而产生的错误。
例如,错误地使用了JavaScript的关键字,错误地定义了变量名称等,这时浏览器运行JavaScript程序就会报错。
很多包含JavaScript的网页都将JavaScript程序代码直接嵌入到HTML文件中,这是最常见的使用JavaScript方法。
在HTML中书写JavaScript时,需要使用一对标记来告诉浏览器这是脚本程序。
在HTML中书写JavaScript的语法格式如下。
--
statements;
//-->
属性language是script标记的基本属性。
一般被指定为JavaScript或VBScript。
runat="server"表示该段脚本在服务器端执行,如果省略,则表示该段脚本将发送到客户端运行。
本书主要讲授JavaScript在客户端的执行过程,因此该属性设置省略。
--...//-->是HTML注释语句。
可以保证不识别
标记选择器的格式定义如下。
tagName{
property:
value;
}
类选择器用来为一系列标记定义相同的呈现方式,语法格式如下。
.classValue{
property:
value
}
classValue是选择器的名称,具体名称由CSS制定者命名。
ID选择器和类选择器类似,都是对特定属性的属性值进行设置。
ID选择器和类选择器的区别是,一个HTML文件中只能使用一次某一ID的属性值。
定义ID选择器的基本语法格式如下。
#idValue{
property:
value;
}
在上面的语法格式中,idValue是选择器名称,可以由CSS定义者自己命名。
为了设置的CSS样式能够在网页中产生作用,必须将CSS和HTML文件联接在一起,才可以正常工作。
在HTML文件中使用CSS的方式有4种:
行内样式、嵌入式、链接式和导入式。
所谓并集选择器就是对多个选择器进行集体声明,多个选择器之间用“,”隔开,其中每个选择器可以是任何类型的选择器。
并集选择器的语法格式。
selector1,selector2,…{
property:
value;
}
在CSS选择器中,还可以通过嵌套的方式,对特殊位置的HTML标记进行控制。
后代选择器的写法是把外层的标记写在前面,内层的标记写在后面,之间用空格隔开,语法格式如下。
selector1selector2{
property:
value;
}
子选择器用于选中标记的直接后代(即儿子),它的定义符号是大于号(>),语法格式如下。
selector1>selector2
相邻(adjacent-sibling)选择器是另一个有趣的选择器,它的定义符号是加号(+),相邻选择器将选中紧跟在它后面的一个兄弟元素(这两个元素具有共同的父元素)。
在CSS中伪对象选择器主要有:
first-letter、:
first-line、:
before和:
after。
之所以称这些选择器是伪对象,是因为它们在效果上使文档增加了一个临时的元素,这是应用“虚构标记”的一个典型实例。
字体属性用于控制网页中文本字符的显示方式。
包括font,font-family,font-size,font-style,font-variant和font-weight等。
font-family属性
确定要使用的字体列表。
font-size属性
font-size属性用于控制文字的大小,它的取值分为4种类型:
绝对大小、相对大小、长度值以及百分数。
该属性的默认值是medium。
font-style属性
font-style属性确定指定元素显示的字形。
值包括normal、italic和oblique三种。
默认值为normal,表示普通字形;italic和oblique表示斜体字形。
font-variant属性
font-variant属性决定了浏览器显示指定元素的字体变体。
有三个值:
normal、small-caps和inherit。
font-weight属性
font-weight属性定义了字体的粗细值,它的取值可以是以下值中的一个:
normal、bold、bolder和lighter。
font复合属性
使用font属性可一次性设置前面介绍的各种字体属性(属性之间以空格分隔)。
在使用font属性设置字体格式时,字体属性名可以省略。
font属性的排列顺序是:
font-size倒手第二和font-family在最后,两者是必须出现的,而font-weight、font-variant、font-style三者在前面,循序无要求。
文本属性用于控制段落格式和文本的修饰方式,例如设置单词间距、字符间距、首行缩进、段落对齐方式等。
CSS中的常用文本属性包括word-spacing、letter-spacing、text-align、text-indent、line-height、text-decoration和text-transform等。
在CSS中,颜色属性可以用设来置元素内文本的颜色,而各种背景属性则可以控制元素的背景颜色以或背景图像。
color属性用来描述元素的前景颜色,CSS背景属性包括background、background-attachment、background-color、background-image、background-position和background-repeat等。
在HTML文档中可以直接通过标记来添加图片。
使用border、width、height等属性可以在HTML中调整图片。
使用CSS,可以为图片设置更加丰富的风格和样式,包括添加边框、缩放图片、实现图文混排和设置对齐方式等。
如果需要单独地定义边框一边的样式,可以使用border-top-style设定上边框样式、border-bottom-style设定下边框样式、border-right-style设定右边框样式和border-left-style设定左边框样式。
默认情况,网页上的图片按原始大小显示。
页面排版时,通常情况下还需要对图片的大小进行重新设定。
如果对图片设置不恰当,会造成图片的变形和失真。
设定图片大小,可以采用以下三种方式。
使用img的标记属性width和height
使用CSS3中max-width属性和max-height属性
使用CSS中width和height属性
网页效果的展示很多情况下都是通过图文混排来实现的。
使用CSS,可以设置多种不同的图文混排方式。
文字环绕
CSS使用float属性来实现该效果。
float语法格式如下。
float:
none/left/right;
其中none表示默认值对象不浮动,left表示文本流向对象的右边,right表示文本流向对象的左边。
3.JavaScript的主要知识点
JavaScript是一种脚本语言,是一种介于HTML与高级编程语言(Java、VB和C++等)之间的特殊语言。
脚本是一种能完成某些功能的小程序段,该程序段由一组可以在Web服务器或客户端浏览器运行的命令组成。
脚本语言可以嵌入HTML页面,并被浏览器解释执行。
使用脚本可以把网页对象和浏览器对象集成并组装起来,使网页具有动态效果和交互功能。
JavaScript是一种脚本语言,是一种基于对象的编程语言,JavaScript本身提供了非常丰富的内部对象供设计人员使用。
JavaScript是一种解释性编程语言,其程序由浏览器解释执行。
JavaScript的代码是一种文本字符格式,可以直接嵌入HTML文档中,并且可动态装载。
JavaScript程序的编写和运行
(1)启动DreamweaverCS5新建HTML文件。
(2)在
与标记中输入代码。(3)将文件保存为.html或.htm格式文件即可。
程序错误分为语法错误和逻辑错误两种。
语法错误是指在程序编写过程中使用不符合语言规则的语句,从而产生的错误。
例如,错误地使用了JavaScript的关键字,错误地定义了变量名称等,这时浏览器运行JavaScript程序就会报错。
很多包含JavaScript的网页都将JavaScript程序代码直接嵌入到HTML文件中,这是最常见的使用JavaScript方法。
在HTML中书写JavaScript时,需要使用一对标记来告诉浏览器这是脚本程序。
在HTML中书写JavaScript的语法格式如下。
--
statements;
//-->
属性language是script标记的基本属性。
一般被指定为JavaScript或VBScript。
runat="server"表示该段脚本在服务器端执行,如果省略,则表示该段脚本将发送到客户端运行。
本书主要讲授JavaScript在客户端的执行过程,因此该属性设置省略。
--...//-->是HTML注释语句。
可以保证不识别
copyright@ 2008-2022 冰点文档网站版权所有
经营许可证编号:鄂ICP备2022015515号-1