盲人如何制作网页讲座.docx_第1页
盲人如何制作网页讲座.docx_第2页
盲人如何制作网页讲座.docx_第3页
盲人如何制作网页讲座.docx_第4页
盲人如何制作网页讲座.docx_第5页
已阅读5页,还剩23页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

盲人如何制作网页讲座:第一讲 前言及盲人制作网页简介山东烟台盲人 朱清毅一、前言 设计制作网页对于健全人而言,那是轻而易举的事情。在网页制作工具中轻点鼠标,很快就可以做出精美的网页。然而对于盲人来说,设计制作网页似乎是无法克服的难题。网页的结构、图片的位置、页面的颜色等元素,无疑成了横在盲人朋友面前不可逾越的鸿沟。于是许多盲人朋友要么在一些提供网站原码的网站下载回来全站原码,稍做简单修改而成;要么就聘请健全人协助制作网页。虽然盲人网站如雨后春笋般纷纷涌现,但是完全由全盲的盲人朋友亲手制作的网页却凤毛麟角。 笔者经过一年多的潜心钻研和不断探索,攻克了重重难关,由笔者亲手设计,全国第一个盲人自主制作的网站清毅-中国盲人信息网,于2001年11月27日和大家见面了。为了让更多盲人朋友能够拥有真正意义上的个人网站,笔者责无旁贷地把多年来制作网页的经验沉淀,总结出来,与同病相怜的朋友们分享。让这希望的种子植根于盲人月刊这方心灵的沃土,在不久的将来收获无数个盲人朋友亲手设计制作精美而实用的网页。或许还可以为盲人朋友的工作生活另辟蹊径,开拓出一片崭新领域。 二、 盲人制作网页简介 1、了解网页: 什么是网页?您知道为什么网页可以在Internet上传播,为什么可以被您的电脑认识吗?盲人又能如何编写结构复杂的网页呢?还是让我们先认识一下网页吧。网页的学名称作HTML文件,是一种可以在www网上传输,并被浏览器认识和翻译成页面显示出来的文件。www是world wide web的缩写;HTML的意思则是Hypertext Markup Language,中文翻译为超文本标记语言。超文本就是指页面内可以包含图片、联接、甚至音乐,程序等非文字的元素。网页就是由HTML语言编写出来的。一个HTML文件中包含了所有将显示在网页上的文字信息,其中也包括对浏览器的一些指示,如哪些文字应放置在何处,显示模式是什么样的等。包括图片、动画、声音或任何其它形式的资源,HTML文件也会告诉浏览器到哪里去查找这些资源,以及这些资源将放置在网页的什么位置。HTML文件通过标志符(tag)来实现这一功能。我们盲人朋友就是学习这些标志符以达到随心所欲地控制网页内各种元素的。明眼人有各种各样的网页制作工具,即使是使用 WPS或WORD 的高手对学习制作网页也算会了一半了,只是利用工具把html代码自动生成而不用手工输入了。但不管使用什么样的工具,其基本的东西都离不开html语言,也就是说在用鼠标对网页中的图片、文字、颜色等元素做调整的时候,网页中的代码也随之变化,正因如此我们盲人朋友就可以用记事本打开这些代码进行手工修改,并可以随心所遇地调整网页中的图片的位置、网页或文字的颜色等,所以只要盲人朋友熟练掌握 html语言,加之丰富的想象力,一定能做出非常精美的网页。 HTML语言发展很快,已经历经HTML1.0、HTML2.0、HTML3.0、html4.0等多个版本,现在html5.0正在测试,同时DHTML (动态)、VHTML(虚拟)、SHTML等也飞速发展。我们现在一般只要掌握HTML4.0就可以了。 2、标志符是HTML语言的核心 标志符是一些字母或单词,并被放在尖括号内(尖括号就是小于号和大于号)。HTML文件可支持很多种标志符,而我们常讲的学习HTML语言实际上就是学习这些各种各样的标志符。每种标志符的作用不同,例如,如果有的用于将文字放大,有的用于将文字居中,有的则负责与其它信息进行链接。当你需要对某处进行修改时,就把标志符放置在该处前面,这时浏览器就会知道你希望下面的内容应如何显示了。总之标志符是控制网页各类元素的核心。例如,你想把制作网页这四个字用粗体显示,从而在网页中突出这四个字,使用粗体标志符。B是英文bold的首字母,意即粗体,实际上很多标志符都是使用英文缩写的,这能够方便使用者记住它们。当你使用这个标志符后,就会告诉浏览器说:我希望在此之后的所有内容均以粗体显示。而浏览器自然会按照你的指令将这个标志符后所有的内容均以粗体显示。 下面以实例的方式把制作网页四个字在网页中以粗体显示的方法给大家进行讲解: 设置您的计算机:若安装完操作系统后没有做任何设置的情况下,计算机中各类文件的扩展名是盲人朋友在制作网页的过程中为了能随意更改文件的扩展名,所以首先把您的计算机调整为显示已知文件类型的扩展名。具体设置方法是:打开控制面板/文件夹选项/查看选项卡/高级设置,将隐藏已知文件类型的扩展名前面的对钩去掉,然后点击确定,此后除文件夹和快捷方式以外的各类文件都将有一个扩展名,比如记事本的扩展名是.txt。 在讲解前大家请先了解一下注释文本的标志,因为在此后的讲解过程中我们将反复用到,该标志中的文本内容将不在网页中显示,只做为解释某行代码的意义。其基本格式如下: 只要把需要隐藏的文字放在标志符中就可以了,在这一行中的注释文本内容几个字在网页中是不显示出来的,其功能是为编写者记录一些信息,不过在这里不能记录密码等重要信息,因为虽然在浏览器中不能被浏览者看到,但只要查看原文件的话,其中的内容将一览无余了。下面请看粗体显示网页制作的实例:网页制作把上面这段代码复制到记事本中并将其扩展名改为.htm或.html后运行,页面中将会以粗体显示网页制作四个字。制作网页就这么简单,只要把标志符学好制作网页将得心应手。 小结: 本讲对网页的概念及盲人为什么能制作网页做了较为详细的说明,并使用了一个非常简单的网页实例使大家对网页中的最基本元素标志符有了初步的认识,要求大家重点掌握标志符的使用,学习html语言其实就是灵活使用标志符的过程。在今后的各讲中我们将由浅入深、循序渐进地详述各类标志符的使用,请大家在学习过程中认真理解和记忆各标志符的属性特点,同时请大家对各标志符的原码及作用做好笔记,以方便在今后制作网页的过程中进行查阅。 作者简介: 朱清毅,男,汉族,1975年生人,现居地山东烟台,高中二年级时因病至双目失明,1993年9月进入吉林四平盲校学习,1995年考入长春大学特教学院,2000年春在烟台开办了推拿诊所,2001年11月创办了清毅盲人网,5年来网站免费为残疾人发布招聘求职征婚等信息达4万余条;2002年参加了烟台大学的电子商务教学;2003年考入北京联合大学特教学院成教专科升本科的学习;2005年9月参加了中国盲人协会主办的首届全国盲人计算机高级语言培训班,2005年底开发的第一个软件清毅盲人考试系统问世,并在2005年11月28日由中国盲人协会主办的全国盲人信息无障碍咨询科技研讨会上参展,该系统在2006年10月31日由中国残联、中国盲人协会主办的全国首届盲人软件网页大赛中获得第二名。盲人如何制作网页讲座:第二讲 如何处理网页中的文字上一讲我们了解了网页制作的最基本的方法和过程,从这一讲起我们将正式开始学习网页制作。在学习之前首先要了解一部分最基本的知识,现介绍如下:一、 基础知识 1、 标志符分为单标签和双标签两种单标签:某些标志符称为“单标签”,因为它只需单独使用就能完整地表达意思,这类标志符的语法是:最典型的单标签是,该标签表示换行的意思,比如把“好好学习,天天向上”这句话用单标签“”将其分成两行在网页中显示的方法是:“好好学习,天天向上”。双标签:它由“始标签”和“尾标签”两部分构成,必须成对使用,其中始标签告诉Web 浏览器从此处开始执行该标签所表示的功能,而尾标签告诉Web 浏览器在这里结束该功能。上一讲我们介绍的粗体显示文字的标签“”就是双标签,使用双标签的过程中一定不要忘记使用结束标志符。所有的双标签中的英文字母或单词是一样的,只是尾标签比始标签多了一个“/”。下面我们看一个基本网页的代码,一方面了解双标签在网页中的应用,另一方面也可了解一个最基本网页中所必需的几个元素,您可以把这段代码复制到记事本中并将其扩展名改为 .htm 或 .html运行一下看看效果。网页名称网页内容 实例讲解: (1) 上例中使用的全部都是双标签,其中标签是一个网页的第一个标签,那么在网页的最后使用标签结束。 (2) “网页头信息”涉及内容较多,且没有完全固定的内容,而且可以省略,我们将在今后的学习过程中进行介绍。 (3) 标签中的“网页名称”可以根据要求进行修改,在打开网页的时候读屏软件首先读出该名称。 (4) 标签中就是网页的主要内容了,比如上面我们提到的例子“好好学习,天天向上”就一定要放在该标签内。该标签的属性可以对页面的整体效果进行调整,比如页面背景颜色的代码是 “” 、 字体颜色 “body text=颜色代码”,本标签还具有把“已点击”、“未被点击”或“正在点击”的链接名称制作成不同的颜色,可以为网页设置背景图片等功能,在以后的课程中我们将逐一对该标签的各属性进行详细的介绍。看到这里朋友们可能会有疑问了,“颜色代码”是什么呢?不要急,在本节的后面有对其详细的讲解。 2、标签属性 许多单标签和双标签的始标签内可以包含一些属性,其语法是: 各属性之间需要有一个空格隔开,没有先后次序,属性也可省略(即取默认值),例如: 实例讲解: (1)上例中的 “hr” 表示在网页中画一条横线如果不加任何属性的话写法是 ,那么所有属性将取默认值,在默认情况下是从左至右在页面中画一条横线。 (2)“size=3” 属性是线条的粗细,其数值可根据要求做调整,数值越大线条越粗。 (3)“align=left”属性是把这条线居左排列,若要使其居中排列其参数是“center”,居右排列则使用“right”。 (4)“width”属性是设置该线条的长度,其参数可以为像素,也可以使用百分数,比如本例中就是使用的75%。 以上介绍的各属性适用于许多标签中,比如图片的位置及大小、字体的大小等,在今后的学习过程中会经常遇到这些属性。 3、一般在HTML 文件里,不管输入多少个空格(按空格键)都将被视为一个空格,任何回车操作(按“Enter” 键)都是无效的。 4、空格符号: “”, 作用是在网页中输入一个空格,因为我们在制作网页的时候不同于记事本或word文档,无论输入多少空格都被系统默认为一个空格,那么如果要在网页中使一段文字前面空出4个空格的话只能把“”输入4次。 5、换行标记:“” ,单标记,作用是将文字换行显示,效果就如同按回车键;那么,如果使用就是强制不换行,不管网页有多大,只要用了这个标志符将永不换行。 6、段落标记: ,它与 标记的区别在于, 除了换行外,还会用一行空白加以间隔,效果就如同连续按了两个“回车” 键。 7、居中显示网页元素,使用 。 8、原始版面标记: ,在html 文件中所采用的文字版面有原样显示在浏览器中,在这个标记里,回车、空格都是有效的。 9、属性的就近原则:当出现两个属性同时控制网页中相同的组件时,组件里哪个越近,就由哪个标记的属性来控制。 10、特殊字符的应用:“<”(小于号)、“>”(大于号)、“&”(“&”符号)、“”(空格)、“”(问号)。11、上、下标标记的使用: 上标标记; 下标标记。二、 如何处理网页中的文字处理网页中文字的标签是: 其中有设置字体、字体大小、字体颜色等属性。请看下例:我开始制作网页了! 实例讲解: (1)上例中是在网页中显示“我可以制作网页了!”几个汉字,其中 size=5 属性是设置字体为5号字,其数值可随意更改,数值越大字体就越大; (2)color=“red”标签是设置字体的颜色为红色,其颜色包括下列预定义色彩:Black(黑色),Olive(橄榄绿),Teal(水蓝色),Red(红色),Blue(蓝色),Maroon(栗色),Navy(海军蓝),Gray(灰色),Lime(酸橙色),Fuchsia(紫红色),White(白色),Green(绿色),Purple(紫色), Silver(银色),Yellow()黄色, Aqua(浅绿色),该值也可以使用16进制数码比如白色可表示为 size=“#FFFFFF”、黑色可表示为 size=“#000000”,因表示颜色的16进制数码数目较多,为了不占用更多的篇幅就不一一在此列举,我专门制作了一个颜色代码选择器以供盲人朋友制作网页使用,朋友们可以到我的网站下载使用,网址是:; (3)face=“宋体_gb2312”是设定不同字体的,可以根据需要将其改成黑体或楷体等。 标志符也可以嵌套使用,比如我们把上例中“我开始制作网页了!”中的制作网页4个字以粗体显示可以做如此修改: 我开始制作网页了! 也就是说在没有改变 标签中的各属性的前提下把“制作网页”4个字的字体加粗了,这样的效果主要目的是突出显示重要的词汇,使明眼人一看便知道该词的重要性。 盲人朋友在写代码的时候一定要切记,标签与其后的各属性之间务必要有一个空格。由于视力所限,在选择不同的字体、确定字体的颜色和大小的时候往往无法判断其在网页中的效果,起初会是一个难点。在这里告诉大家一个小窍门,一般情况下,网页的背景颜色可采用白色,字体可选择黑色或深蓝色,这样颜色对比鲜明,明眼人阅读起来较为方便。然而为了使网页更加个性化,我们经常需要把颜色或大小做一些调整,在我们不断调整的过程中,可随时求助明眼人协助看一下网页的效果,根据他们的建议和提示,我们通过修改网页代码实现网页各元素的调整,最终达到完美视觉效果的目的。经过几次帮助之后,盲人朋友就会慢慢积累经验,很快脱离明眼人的帮助,独立制作出独具匠心的网页。小结:本讲我们介绍了制作网页的一些基本知识和如何处理网页中的文字的问题,本讲中所涉及到的各个标签都非常重要,大家需要在计算机上反复操作练习,必须做到牢记且能够灵活应用以上各标签。盲人如何制作网页讲座:第三讲 控制网页中的图片一、控制网页中的图片图片能使网页变得错落有致、缤纷多彩。下面我们以实例的方式对图片的插入与排列进行详细介绍:1、 插入图片标签的应用:将一幅图片放置在网页中之前,你需要知道该文件的名称以及文件存储在服务器的哪个目录下,这样你就可以告诉浏览器到哪里去查找该幅图片了。储存图片最简便的方法是将图片保存在与 html 网页文件所在的目录中,这样浏览器就可以自动寻找到图片。假设我们有一幅名为 “abc.gif” 的图片,并与你制作的 html 文件在同一个目录中,这时你应该输入下列代码 。这样就把一幅名为 “abc.gif” 的图片插入到网页中了。如果图片没有与 html 文件在同一目录中的话,则需要把图片所在位置的全路径地址及图片名称填入 src= 属性中。2、排列图片标签的应用:使用排列图片标签可以控制图片在网页中的位置,如果使图片显示在网页右边的话其代码是 ,若要使该图片居左显示,把 align=“right” 改为 align=“left” 即可。将图片放置在网页的正中则略显复杂,因为 标志符并不能在所有浏览器中产生正确的效果,因此如果需要将图片居中,首先需要把该段内容全部居中,方法是使用标志符,然后再添加插入图片的标签即可。具体的代码是:3、设置图片边界标签的应用:对图片的边界大小控制也就是控制一个网页中图片的边缘显示有多宽,一般图片的边界只有当你把它当作一个链接时才会显示出来,不过我们也可以根据需要利用 这个标签来任意设置图片的边界,只需把“?”替换为从0至99的数字即可。另外,一般最常用的是你可以把图片边界的宽度设为0,即 这样图片就不会显示边界了。例如,如果我们为“abc.gif” 设置一个边界,可以这样做:。4、 设置图片的宽度和高度标签的应用:在网页中插入一幅图片,如果我们不对其大小做更改的话,浏览器将以默认的尺寸进行显示,但很多时候我们都要根据网页制作的某些需求来调整图片的显示尺寸,这时候就要用到 这一标签了,其中 width=“?”是设置图片的宽度, height=“?”是设置图片的高度,只要根据需求把其中的“?”换成数值即可,在设置图片显示尺寸的时候一定要注意必须在图片原尺寸的基础上进行调整,查看原图片的尺寸后再根据相应的比例进行调整,否则有可能出现图片变形的情况,比如原图片是正方形的,但我们在网页中控制图片的高度和宽度的值不一样就造成了图片变成长方形的了。若我们设置 “abc.gif” 的宽度和高度的话则表示为:。5、设置背景图片标签的应用:网页的背景不仅可以设置成不同的颜色,而且还可以用某张图片做为其背景,其特点是完全填充整个页面,而且显示在所有网页元素的后面,不影响文字或其他图片的显示。比如我们要在页面上显示一段文字并且以雪花飞舞为背景的话,有的朋友可能会想到首先要做一张雪花飞舞的图片,然而这样操作似乎显得太麻烦了,只要做一张非常小的只有一两片雪花飞动的图片,利用本标签就可以达到整个页面雪花飞舞的效果了,其原代码如下:天下雪了,冬天来了。特别值得注意的就是该标签如果用的不合适的话可能造成网页显示非常杂乱,所以在应用的过程中一般可以考虑使用小的图片起到对网页的点缀的效果即可,最好能在明眼人的帮助下使用该标签。6、图文混排的方法:虽然网页中提供各种图片可以使网页显得更加漂亮,但有时你也需要在图片旁边添加一些文字说明。图文混排一般有几种方法,通过标志符来实现。对于初学者而言,你可以将图片放置在网页的左侧或右侧,然后将文字内容放置在图片旁边。请看下面图文混排的例子,文字信息会与图片并排从左侧开始:让我们共同努力学习吧,相信很快大家一定能做出非常精美的网页的!也许有时你希望文字内容从图片上方开始,并包围整幅图片,这时可以编写下列代码:让我们共同努力学习吧相信很快大家一定能做出非常精美的网页的!二、创建链接1、基本链接的创建:如果一个网页中没有一个链接那确实就没什么意义了,因为正是方便的各种链接才将各个独立的网页构建成一个庞大的网络,就可以利用 链接名 这个链接标签来创建链接,让我们制作的网页之间相互连接并且可以使我们的网站与其它网站相连。在创建链接之前,需要清楚想要链接的网页的url地址,这个url地址就是类似“”这样的网络地址。接着就是决定把网页中哪段文字做为链接,访问者将通过这个链接访问其它地方。另外,一般情况下凡是链接的地方都会有下划线,并显示出与普通网页文字不同的颜色以便区分,多数默认情况下链接显示为蓝色,除非对此进行了特殊的设置。例如一个网页链接的源代码可能是下面这个样子:欢迎光临清毅盲人网2、弹出新页面的链接:我们在浏览网页的时候,当点击相应的链接原网页并没有关闭,而且弹出一个新的页面,这种效果主要是在创建基本链接的基础上增加了 target=“_black”属性实现的。请看下面的例子:欢迎光临3、创建图形链接:有的时候为了实现把某一图片做为链接的效果,也就是说当点击图片的时候就可以打开新的页面,其原码如下: 然而使用这种方法将不支持读屏软件的操作,盲人朋友按 TAB_键听读链接的时候将无法听到链接的名称,为了解决这个问题我们可以使用 title=“链接名”这个属性来解决。具体代码如下:此法不但读屏软件可以读出链接名称,而且当鼠标指向该链接的时候也将以气泡的方式显示该链接的名称,也是广大盲人朋友实现网络信息无障碍的一个重要链接属性。4、创建邮件链接:如果你在自己制作的网页中加入一个访客给你发邮件的链接就更增加了网页的互动性,假如我们把 “”这个邮件地址在网页中做一个链接,其原码如下:点击这里给我发邮件吧5、编辑链接颜色:链接的颜色如果不做编辑的话浏览器将对其取默认颜色,若希望调整其颜色可将以下代码中的“?”换成相应的颜色代码即可。 设置链接颜色;设置你已经访问过的链接的颜色;设置你正点击的链接的颜色。盲人如何制作网页讲座:一、处理网页颜色颜色的概念对于许多先天失明的盲人朋友而言,几乎属于真空领域。然而在网页的制作过程中,色彩的运用又是必不可少的,颜色的合理搭配,能使网页精美典雅,充分体现出制作者的品味;一个别具一格的网页,也会令来访者赏心悦目,流连忘返,大大提高网站的流量。那么有办法解决这个难题吗?答案当然是肯定的。为了盲人朋友能够得心应手地驾驭这些颜色,我们必须掌握相关色彩原理的知识。实践证明,只要盲人朋友能够持之以恒的努力学习,充分领会相关色彩原理的知识后,就能灵活恰当地运用这些色彩知识,制作出的网页就会绚丽多彩、充满活力。即使很简单的页面、图像也不复杂,只要色彩运用得当,那也将是高水准的网页。1、色彩的基本概念自然界中的颜色可以分为非彩色和彩色两大类。非彩色指黑色、白色和各种深浅不一的灰色,而其他所有颜色均属于彩色。任何一种彩色都具有三个属性:(1)色相(Hue):也叫色泽,是颜色的基本特征,反映颜色的基本面貌。(2)饱和度(Saturation):也叫纯度,指颜色的纯洁程度。(3)明度(Brightness或Lightness或Luminousity):也叫亮度,体现颜色的深浅。非彩色只有明度特征,没有色相和饱和度的区别。、色彩的三原色电脑屏幕的色彩是由RGB(红、绿、蓝)三种色光所合成的,而我们可通过调整这三个基色就可以调校出其它的颜色,在“清毅盲人网”有专为盲人朋友制作的“清毅颜色查询器”的下载,该工具可调出百余种颜色以供盲人朋友们参考。这里不再详述。3、盲人朋友使用色彩的技巧我们必须要了解在页面中尽量使用看上去比较淡雅、简洁的色彩;比如背景尽量少用灰暗、深沉的色彩(除非特殊需要),并且要根据页面的主题来选择主色调,不同的色彩代表的含义是不同的。红色:代表热情、奔放、喜悦、庆典;黑色:代表严肃、夜晚、沉着;白色:代表纯洁、简单;黄色:代表高贵、富有;蓝色:代表天空、清爽;绿色:代表植物、生命、生机;灰色:代表阴暗、消极;紫色:代表浪漫、爱情;棕色:代表土地。那么我们如何在一个网页中合理搭配色彩呢?技巧一:根据体裁选色,首先在确定主页的题材后,要了解哪些颜色适合哪些站点。比如一个影视的站点,基本上适用任何色彩,但也有的美术专家认为用黑色或其他较深的色彩为主比较好,因为人们看电视、电影一般在黑暗的环境下观看的,网页上使用深色较符合人们的视觉习惯;反之一个介绍医院、医学的站点就要使用浅色为主色,衬托其医学站点的氛围。技巧二:万能色,白色的页面是万能的风格,我们制作网页的时候如果不想在页面色彩方面伤脑筋的话只要把背景设置成白色即可。这里特别要注意的一点:页面颜色、文字颜色与链接颜色一定要区分开来,否则如果设置成同一种颜色的话虽然我们的读屏软件可以读出,但明眼人朋友却任何文字也看不到了。4、调整页面色彩标签的使用调整网页的颜色只要在 标签中加入 bgcolor=“颜色代码”属性即可,比如把页面颜色设置为白色可在网页中加入如下代码: 或 其中 “#FFFFFF”是颜色代码,其各类颜色的代码可在“清毅颜色代码查询器”中获得。二、滚动字幕的制作我们已经对网页中的色彩及图片有了较为系统的认识,如果再让网页中的文字动起来的话也就更增加了网页的活力,即制作滚动字幕。所谓滚动字幕就是使相应的文字在屏幕中特定的区域内按照一定的规则自左向右、自右向左、自上向下、自下向上或左右交替滑动的文字特效。因其滑动的特性使其具备了可以吸引浏览者的注意力以及可以在较小的区域内显示较多的内容两大特点。实现滑动字幕效果的标签是,需要滑动的文字,该标签内有许多属性,我们通过调整这些属性以控制滑动的效果,同时一定要使用文字的控制标签 /font,以调解滑动文字的色彩、字体及大小等属性。请把下面的代码复制到记事本中将其扩展名改为 .htm 或 .html 运行一下,请身边的朋友帮助描述一下看看效果:我制作的第一个滑动字幕你们好啊,今天真高兴 代码详解:1、Align 属性:设置字幕的对齐方式,其参数有3个,left是左对齐;center是居中显示;ight是右对齐。2、Bgcolor 属性:设置字幕的背景颜色。3、direction 属性:设置字幕滚动方向,其参数有4个,left是自右向左滚动;right是自左向右滚动;up 是自下向上滚动;down 是自上向下滚动。4、behavior属性:设置字幕滚动方式,其参数有3个。(1)scroll 属性是按照 direction 属性所规定的方向连续不断的滚动;(2)slide 属性是按照 direction 属性规定的方向滚动至字幕另一侧后文字将不再滚动;(3)alternate 属性是文字在字幕的范围内根据 direction 属性规定的参数进行左右或上下滚动。5、height属性:设置字幕高度,其数值越大字幕越高。6、width属性:设置字幕宽度,其数值越大字幕越宽。7、hspace属性:设置字幕左右方向空白区域的宽度。8、vspace属性:设置字幕上下方向空白区域的宽度。9、scrolldelay属性:设置滚动两次之间的延迟时间,属性值为数值,数字越大,延迟时间越长。10、scrollamount属性:设定滚动速度,属性值为数值,数字越大,滚动速度越快。11、loop属性:设定滚动次数,其数值为大于零的自然数,若将其值设为 “-1” 表示无限循环。使用滚动字幕的注意事项及技巧:1、要注意字幕背景色彩及需要滚动文字的色彩及文字大小的搭配,初次制作的盲人朋友在调整色彩和字体大小的过程中可寻求明眼人朋友的帮助,在此过程中一定要注意积累经验以达到逐渐脱离明眼人的帮助。2、调整字幕高度及宽度的时候一定要考虑显示器的分辨率问题,目前较为主流的显示分辨率为 800*600 像素或1024*768相素,因此字幕宽度及高度以不超过该数值为佳。3、可以使用该标签使整个页面自下向上进行滚动,其设置方法是把整个网页内容置于该标签内即可。4、可以在原本只能显示一个链接的空间内显示多个链接,其效果可以使利用换行符隔开的多个链接自下向上滚动,也可以使并排的多个链接自右向左滚动。5、本标签也可以实现一幅或多幅图片在网页中滚动的效果,其具体代码是:。6、如果你不想在该标签中的各属性中伤脑筋的话,也可以把全部属性省略或仅使用某个属性,如果全部省略的话其默认值的效果则是以白色背景适中的速度自右向左滚动,此时不要忘了使用 设置字体的色彩及大小,此时字幕的宽度将会根据字体的大小进行自动调整的。盲人如何制作网页讲座:第五讲 如何在网页中制作弹出窗口和播放音视频文件一、在网页中制作弹出窗口经常上网的朋友肯定会遇到这样的情况,当登陆某网站的首页时,立刻会弹出一个窗口,或者在点击某个连接或点击某按钮时也会弹出窗口,有时这个窗口几秒钟后会自动消失,有时需要手动将其关闭。通常这些窗口里面显示的内容都是网站的一些提示信息,如注意事项、版权信息、警告、欢迎光临等。实际上制作这样的页面效果非常容易,只要在该页面的代码中加入几段命令即可实现。下面咱们就一起来深度探索其制作原理。(一)弹出窗口基本代码若希望在制作的网页中把事先已经做好的abc.htm,这一页面做为窗口弹出的话,只要把下面的代码复制到您的网页中的 和 之间即可:实例解析:1、: 因本弹出窗口的代码是一段 “javascript” 角本语言,这段代码是角本的开始标签;2、window.open: 弹出新窗口的命令;3、abc.htm: 弹出窗口的文件名;4、窗口名称: 弹出窗口的名字(不是文件名),非必须,可用空代替;5、width=260 弹出窗口的宽度;6、height=300: 弹出窗口的高度;7、top=0: 窗口距离屏幕上方的象素值;8、left=0: 窗口距离屏幕左侧的象素值;9、toolbar=no: 是否显示工具栏,yes为显示;10、menubar,scrollbars: 表示菜单栏和滚动栏。11、resizable=no: 是否允许改变窗口大小,yes为允许;12、location=no: 是否显示地址栏,yes为允许;13、status=no: 是否显示状态栏内的信息(通常是文件已经打开),yes为允许;14、: Javascript 脚本结束;15、: 该标签的目的是避免浏览器把没有使用大于号和小于号的代码显示出来,这个主要是针对低版本的浏览器。(二) 用函数控制弹出窗口建立弹出窗口函数,使用起来更方便,调用函数可以在打开页面的时候弹出窗口,也可以在关闭该页面的时候弹出窗口,而且还可以利用链接或按钮进行调用。请看下面的实例:网页内容上面的实例中定义了一个函数openwin(),函数的功能就是打开一个名为 “abc.htm”的窗口。在调用它之前是没有任何用途的,那么怎么调用呢?请看下面的实例讲解。1、打开页面的时候自动弹出: 只要在标签中加入相应的代码即可,代码是 ;2、关闭页面后弹出窗口: 代码是 3、用一个连接调用:代码是 打开一个窗口4、用一个按钮调用: 代码是 5、 同时弹出两个窗口,该功能只要对源代码稍微改动一下即可。具体改动方法如下:注意事项:为避免弹出的两个窗口覆盖,用top和left控制一下弹出的位置不要相互覆盖。最后用上面介绍过的四种方法调用即可。两个窗口的name(窗口名称1和窗口名称2)不要相同,或者干脆全部为空。(三) 定时关闭和手动关闭打开的窗口1、自动关闭窗口首先,将如下代码加入 “abc.htm” 文件的区:实例解析:(1) 上例是在所弹出的窗口 “abc.htm” 文件中定义了一个关闭页面的函数,其中的 10000 这个数值是毫秒,每秒等于1000毫秒。那么本例将在10秒钟以后关闭窗口;(2) 然后再用 这一句话代替 “abc.htm” 中原有的这一句就可以了。(这一句话千万不要忘记写啊!这一句的作用是调用关闭窗口的代码,10秒钟后就自行关闭该窗口。)2、手动关闭窗口只要在弹出的窗口文件中的 与之间加入下面代码即可在页面中出现一个名为“关闭” 的按钮,点击后即可实现关闭该窗口的效果。注意:除了点击打开窗口外,其它形式的窗口自动弹出很容易被一些工具栏阻挡,如上网助手、Google、百度工具栏和IE6SP2自带的“弹出窗口阻止程序”等。因此,在制作网页时千万不要将重要内容放到弹出窗口中。二、如何在网页中播放音频及视频文件通过网页播放音视频的方法较多,我们在这里介绍两个比较常用的方法:(一)使用 标签播放背景音频文件 标签属于单标签,其属性共有5个,其中balance是设置音乐的左右均衡;delay是进行播放延时的设置;loop是循环次数的控制;src则是我们音乐文件的路径,volume是音量设置。一般在添加背景音乐时,我们并不需要对音乐进行左右均衡以及延时等设置,而且这些设置对某些声卡无效,我们在制作网页的时候只要将其省略系统将自动取其默认值,所以仅需要几个主要的参数就可以了。请看下面的代码:实例解析:1、src=ok.wav 是设置音频文件路径及名称,该标签还可以播放 .midi, .mp3, .wma格式的文件;2、其中 loop=2 是使背景音乐连续播放两次, loop=-1 是设置无限循环播放。(二) 使用 标签播放音频及视频文件本标签为双标签需要以 结尾,该标签还可以在页面上生成一个播放控制面板,该面板提供了调整音量及暂停播放等功能。其播放的文件类型有 flash动画(扩展名为 swf);音频视频文件(扩展名为 mp3、wma、wav、mid、avi、rm、ram等)。其最简单写法是 这样其他各属性将取默认值,下面介绍几个较常用的属性:1、src=文件地址和名称;2、width=播放面板宽度, height=播放面板高度,取自然数,也可以省略;3、autostart=true或者false,决定音乐文件下载完毕后是否自动播放,默认为false。对于flash动画无效;4、loop=“循环播放次数”;5、hidden=true或者false,决定是否隐藏播放面板,true为隐藏;6、quality=设定播放质量,low(播放质量最差)、medium(播放中等质量)、high(播放高质量,默认)、best(播放极高质量);以上这两个标签的区别在于 只能播放音频文件,而且没有播放面板,页面最小化时将停止播放正在播放的文件; 标签则可以播放音频和视频文件,而且有播放面板,最小化页面时仍然继续播放正在播放的文件。盲人如何制作网页讲座:第六讲 在网页中如何使用列表(上)一、 在网页中如何使用列表我们在制作网页的过程中经常需要在某个区域内以列表的形式排列文本内容,因网页不同于我们经常使用的记事本或 word文档等文字处理工具,其内容必须通过代码控制,否则将在网页中不规则地显示出来,使用列表技术将使网页更加有条理,而且不需要考虑其对齐的方式,浏览器将自动把列表中的内容进行排列,网页中的列表可分

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论