网页与web程序设计

上传人:飞*** 文档编号:35383042 上传时间:2018-03-15 格式:PDF 页数:6 大小:11.51KB
返回 下载 相关 举报
网页与web程序设计_第1页
第1页 / 共6页
网页与web程序设计_第2页
第2页 / 共6页
网页与web程序设计_第3页
第3页 / 共6页
网页与web程序设计_第4页
第4页 / 共6页
网页与web程序设计_第5页
第5页 / 共6页
点击查看更多>>
资源描述

《网页与web程序设计》由会员分享,可在线阅读,更多相关《网页与web程序设计(6页珍藏版)》请在金锄头文库上搜索。

1、1. 什么是 WWW?WWW是 World Wide Web 的缩写,简称为Web (万维网)。WWW是一个全球性的信息系统,使计算机能 够在 Internet上相互传送基于超媒体的数据信息。WWW也可以用来建立Intranet(企业内部网)的信息系统。WWW具有三个统一:1.统一的资源命名方式:URL (统一资源定位符,即网址)。2.统一的资源访问方式:HTTP (超文本传输协议)。3.统一的信息组织方式:HTML (超文本标记语言)。2.WWW 的特点分布式的信息资源。统一的用户界面。支持各种信息资源和各种媒体的演播。广泛的用途。3. 什么是 HTML ?超文本标记语言(HTML Hype

2、rText Markup Language)是用于设计网页源文件(网页文档)的语 言。每一个页面的代码保存为一个网页源文件(.htm文件 ) 。八十年代初, HTML由万维网联盟(W3C :World Wide Web Consortium)制订。HTML包括一些定义页面内容和格式的符号,称为标记。它能够将文本、图像、声音和动画结合在一个 网页文档中。这些文档可以通过Web浏览器显示,还可以通过超链接以访问其它的信息资源。后来,进一步推出了XML (扩展标记语言),该语言可以由程序员自己定义标记。4. 什么是标记?标记是网页文档中的一些有特定意义的符号。这些符号指明如何显示文档中的内容。标记总

3、是放在三角括号中,大多数标记都成对出现(有开始标记和结束标记)。结束标记和开始标记 所用的字符相同,只是前面加一个斜杠。例如:, 用于标记一个自然段。标记可以具有相应属性即各种参数,如size 、 color 、 text、 width和 noshade 等 。例如: 标记通常可以分成两种:第一种用来指定网页上的元素或元素的样式。例如,指定一个自然段及其字体和颜色:自然段内容。第二种用来指向其它的资源。例如,指定一个链接地址:武汉大学 指定一个图片文件:5. 什么是超文本、超媒体和超链接?超文本是网页上具有链接功能的文字。例如,娱乐新闻电影。超媒体是网页上具有链接功能的多媒体。超链接是网页上连

4、接其它网页或网页上指定位置的超文本和超媒体。超链接分为文字和图像(包括动画)两种,网页中的一段文字、一副图像或图像的某一个部分等都可 以定义为超链接。6 网页中的基本元素文本图像多媒体超级链接表单导航栏其他常见元素7 滚动:用来设置当没有足够的空间来显示当前框架的内容时是否显示滚动条。本项属性有4 种选择:“是”表示显示滚动条;“否”表示不显示滚动条;“自动”表示当没有足够的空间来显示当前 框架的内容时自动显示滚动条;“默认”表示采用浏览器的默认值(大多数浏览器默认为自动)。CSS样式概述8 CSS (Cascading Style Sheet)样式是一系列格式设置规则,是用于(增强)控制网页

5、样式并允许 将样式信息与网页内容分离的一种标记性语言。使用CSS样式可以非常灵活并更好地控制具体的页面 外观,从精确的布局定位到特定的字体和样式等。9 CSS 格式设置规则由两部分组成:选择器和声明。选择器是标识已设置格式元素( 如 P、H1、类名称或 ID) 的术语,而声明则用于定义样式元素。在下面的示例中, H1 是选择器,介于大括号 () 之间的所有内容都是声明:H1 font-size: 16 px; font-family: Helvetica; font-weight: bold; 声明由两部分组成: 属性和值。上述示例为 H1 标签创建了样式:链接到此样式的所有H1标签的文 本都

6、将是 16 像素大小并使用 Helvetica字体和粗体。10 在 Dreamweaver 中,可以使用四种不同的方法在网页中加入CSS样式。链接外部样式表文件定义内部CSS样式导入外部样式表文件定义内联CSS样式11 (1) CSS滤镜滤镜 (filter)属性是 CSS的一个扩展部分,它能够渲染对象元素,创建出艺术效果。Dreamweaver 的 CSS样式提供了丰富的滤镜效果,使用这些滤镜能够创建出文本和图像的3D、阴影和淡入淡出等效 果,应用在页面中,在一定程度上美化了页面。(2) CSS 滤镜的基本使用方法滤镜的使用和其它CSS样式的定义方法相似,分为外部引用、内部引用和局部引用三种

7、,语法格式 为:filter: filtername(parameters) 其中 filter是滤镜属性标识符,filtername是滤镜属性名称,parameters是滤镜属性自带的若干参数。例如: 12 Dreamweaver中共含有16 种 CSS滤镜,可分为无参滤镜和有参滤镜两类。无参滤镜Gray:使对象产生灰度图效果。Invert:使对象产生“底片”效果。Xray :使对象产生“X 光片”效果。FlipH :使对象产生水平翻转效果。FlipV :使对象产生垂直翻转效果。Light :使对象产生一种模拟光源的投射效果。有参滤镜Alpha :设置对象的透明度。Blur :使对象产生模糊

8、效果。Wave :使对象在垂直方向上产生波纹效果。Shadow :在指定的方向上建立对象的投影。Dropshadow:设置对象的阴影效果。Chroma :将对象中指定的颜色设置为透明色。Glow:在对象的边缘产生类似发光的效果。Mask:为对象建立一个覆盖于表面的膜,其效果就好像是戴有色眼镜看物体一样。BlendTrans :设置对象的淡入淡出效果。RevealTrans :设置对象之间的切换效果。例如:13 使用 JavaScript编写程序的特点:JavaScript是一种脚本语言,采用小程序段的方式实现编程,可以直接嵌入HTML文档中。在标识 ,之间可以加入JavaScript脚本。可将

9、,标识放在 ,或, 之间。将JavaScript脚 本置于 ,之间,可使之在主页和其余部分代码之前装载。JavaScript是一种基于对象的语言,许多功能可以来自于脚本环境中对象的方法与脚本的相互作 用。对于不支持JavaScript的浏览器,所有在 中的代码均被忽略;对于支持JavaScript的浏览器,则执行 中的代码。/ 是 JavaScript的注释标识,其后的信息不被浏览器解释。14 JavaScript对象利用 JavaScript基于对象的功能,可以大大简化程序的设计,用更直观、模块化和可复用的方式进行程序开发。对象的基本知识对象的基本结构:对象是由属性和方法两个基本元素构成的。

10、属性用来描述对象的数据特征,与变量相关联;方法用来描述作用在属性上的操作( 行为 ) ,与函数相关联。例如:大型客机可视为对象,它具有位置、速度、颜色、容量等属性,对于该对象可施行起飞、降 落、加速、维修等操作,这些操作将或多或少地改变飞机的属性值。15 引用对象的方式:要么创建新的对象,要么利用现存的对象。引用 JavaScript内部对象,如Date、Math 等;由浏览器环境中提供,如window、document 等;使用 new运算符创建新对象。16 对象属性的引用方式一:通过点运算符(.) 实现引用例如: university.province = “湖北省 “; universi

11、ty.name = “武汉大学 “; university.date = “1893“; university是一个已经存在的对象,province 、name和 date 是它的三个属性。方式二:通过对象的下标实现引用例如: university0 = “湖北省 “; university1 = “武汉大学 “; university2 = “1893“; 方式三:通过字符串的形式实现引用例如: university“province“ = “湖北省 “; university“name“ = “武汉大学 “; university“date“ = “1893“; 对象方法的引用格式: Ob

12、jectName.methodName( ) 例如: window.alert(“Hello World!“); document.write(“欢迎光临 !“); 浏览器对象:每个HTML文档被载入浏览器中时浏览器就创建了一系列分级的对象体系,其中最常用的 对象包括window、frame 、document、history等。window 对象window对象处于浏览器对象层次的最顶端,代表当前网页所在的窗口,可以用它来参考包含在网页中的所有元件。例如: window.document.bgColor = “FF0000“; window对象是预设的参考对象,因此在使用window 对象的

13、属性和函数时,可以不指定window。例如: window.alert(“欢迎光临 “); 等价于alert(“欢迎光临 “); document 对象document对象是浏览器对象系统的核心,它可以更新正在载入或已经载入的HTML文档,并可以访问载入文档所包含的元件。例如: document.write(“JavaScript学习天地 “); document.fgColor=“#0000FF“; history对象history对象记录着浏览器所浏览过的每一个页面,这些页面组成了一个历史记录列表。用户可 以通过 forward( )、back( )或 go( ) 方法来寻找符合条件的历史

14、记录。例如: history.back( ); /从当前页面后退一页histrory.go(2); /从当前页面前进两页17 事件驱动及事件处理JavaScript是基于对象和事件驱动的脚本语言,通常把由鼠标或热键引发的一连串程序的动作称为事 件驱动。对事件进行处理的程序或函数,称为事件处理程序。JavaScript主要有以下一些常用事件:单击事件onClick :当用户单击元件时,触发onClick事件,同时onClick指定的事件处理程序 将被调用执行。通常在下列基本对象中产生: button (按钮) checkbox (复选框)radio (单选按钮)例单击按钮激活btnClick(

15、)处理程序function btnClick( ) alert(“You have clicked the button!“); 改变事件onChange:当 text 、textarea和 select元件失去焦点且内容被改变时,触发该事件。 例如:function textChange(textObj) alert(textObj.value); 载入事件onLoad:当网页载入完成时,触发该事件。卸载事件onUnload:当用户离开网页时,触发该事件。例如: function loadFile( ) do var name=prompt(“请输入您的大名:“,“); while(name

16、=“ | name=null); alert(“欢迎 “+name+“ 光临 !“); 18 表单“方法”下拉列表框用来选择将表单数据传输到服务器的方式。其选项的含义如下:默认:使用浏览器的默认设置将表单数据发送到服务器。通常,默认方法为GET方法。GET :将表单数据附加在请求页面的URL地址后面。 GET方法用来传送少量数据,字符数不能超过8192 个字符。POST :将在 HTTP请求中嵌入表单数据。POST方法用来传送大量数据。19 什么是层?层提供一种对网页对象进行有效控制的手段,层可以包含文本、图像、表单等所有可直接用于文档的元素,层中还可以包含插件或其它层(嵌套使用)。层提供了精确定位页面元素的方法,通过将页面元素放置在层中,用户可控制对象的叠放顺序、 显示或隐藏,甚至可利用时间轴同时在屏幕上移动一个或多个层。20 行为行为是事件和动作的组合,它允许用户改变网页内容以及执行特定的任务。利用Dre

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 研究报告 > 综合/其它

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号