版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
v1.0可编写可改正云南城市建设职业学院网页设计课程标准系(部):机电与信息工程系课程名称:网页设计编制教师:张捷编制时间:2015年5月11v1.0可编写可改正序言《网页设计》是职业院校计算机领域的一门骨干专业课程,也是计算机及有关专业人才培育计划中的一门专业课程,在大二第二学期开设,课程总学时为108学时,主假如为了让学生掌握网站建设必备的基础知识、基本技术和基本修养,其主要任务是经过网页设计基础学习和实训双方面内容培育学生制作网页、成立保护网站的能力,使学生认识网页制作的方法,掌握网页三剑客与其余多媒体软件相联合开发网站的技术。同时达到培育高素质劳动者和网站建设特意人材的目的,为此后学生就业和连续学习打下优秀的基础。此刻正处于网络化和信息化时代,好多工作都离不开互联网。网站是政府、企事业单位、公司公司信息化的核心,更是其应用宣传信息的要点媒体。所以特依照人材培育方案要求制定以下网页设计课程标准。一、课程基本信息.课程名称:网页设计2.课程类型:专业课基础课3.课程编码:4.学时:1085.合用专业:计算机、网络、挪动通讯等有关专业。1.1课程的性质与作用1.课程的性质网页设计课程是高职计算机、网络、挪动通讯等有关专业要点建设的核心课程之一,是学生职业教育的核心课程。经过本课程的学习,使学生认识网页设计、网站项目创立实行的流程及方法,具备网页设计、网站建设与保护的基本能力,为此后学生到相应的职业岗位工作打下基础。计算机、网络、电子商务等有关专业是为适应市场经济发展需要,培育能在政府、公司、企事业单位从事算机系统保护、网络保护、网页设计、网站建设管理保护、中小型信息系统22v1.0可编写可改正开发等工作的高技术人材、让学生拥有优秀的职业道德、娴熟的专业技术和可连续发展的计算机应用技术领域的高级应用型人材。本课程是一门既包含理论知识又包含实践性、技术都相对较强的课程。2.课程作用本课程有关的典型工作岗位是:前端(网站策划师、网页美工)、后台(网站开发工程师),对其进行典型工作任务与职业能力剖析后,概括提炼出岗位核心能力为“网站建设”,再依照各个典型工作任务的先后次序设置支撑的项目课程群。《网站建设》的先行课程为《图像办理photoshop》,《HTML,CSS,DIV》和《Dreamweaver网页设计》《flash》《T1基础能力美术,图案,色彩基础》《网站建设实训》等,详尽的可见下表,它们是支撑“网站建设”核心能力的基础课程。基础能力扩展能力高级能力PHP(或ASP,JSP)等动向HTML,CSS,DIVHTML+div+css网站开发工具基础能力Dreamweaver迅速建站模板工具Ajax等最新技术T1:网页设FireWorkFireWork网页成效图制作计师PhotoShop基础必定的语言表达、交流能力图形图像办理网站商业广告宣传动画制广告宣传动画flashFlash作能力图片制作T1基础能力T2:网页美工美术,图案,色彩基础娴熟掌握PhotoShop网站标记设计制Logomaker软件应用标记设计作T1基础能力IIS(服务器配置)数据库设计能力T3:网站建设数据库(SQL或ACCESS)使动向网站开发工具项目网站建设,美化用能力高级能力33v1.0可编写可改正T3所有能力数据库设计能力软件工程剖析能力T5:网站剖析理解领域业务的能策划、剖析能力网站需求剖析能力和设计力语言表达、交流能力经过网站项目开发的教课,使学生掌握网站开发的过程及网页的设计制作方法和步骤,该课程主要内容有网站规划与网页设计、静态网页制作、CSS规则的应用、网站测试公布与保护的知识和技术,为后续课程的学习供给网页设计与制作的理论基础和技术支持。本课程不论对培育学生的创新思想、协作精神、正确的设计理念和方法、信息办理能力、解决问题能力、自我学习能力、高级能力,仍是对培育网页、网站制作的实践操作技术、知足职业岗位需求以及对后继课程的学习,都拥有十分重要的作用。1.2课程的基本理念1.突出学生职业能力的培育本课程以建设公司网站项目为载体,以网站项目的建设与保护工程流程为主线,经过项目全面学习网站建设与保护的有关知识和技术,及步骤方法,使学生对真切的建设网站项目的流程有一个较全面的认识,形成职业岗位所需的基本能力,为此后从事有关职业岗位作前期准备。2.以学生主体,从实践中锻炼学生能力本课程在实行过程中,按工作流程将项目分解为详细的工作任务,教课中实行任务驱动,同时,指引学生组建项目团队,以学生为主体,团队在教师的启迪、提示下自主地展开学习,学生依据任务,经过团队议论,主动查阅资料,养成独立策划、剖析问题和解决问题的能力。3.尊敬个体差别,着重过程评论本课程在教课实行过程中,倡议学生自主学习,鼓舞多元思想方式,并将其表达出来,尊敬个体差别,发挥不一样种类学生的优点,成立由形成性评论和总结性评论相联合的评论体44v1.0可编写可改正系,教课过程中以形成性评论为主,着重学生学习的踊跃和自信心,总结性评论着重评论学生做成事的能力。1.3课程标准的设计思路在课程标准的设计过程中以网页设计基础为一定掌握知识,以实训公司网页设计项目的完好创立过程对各环节知识、技术进行知识稳固和运用,环绕预设能力目标,对学习目标、学习任务、能力要求、教课内容、活动设计和教课建议等都均参照人材培育方案。教课方法在教课网页设计基础中主要采纳事例、解说、实做的方式来进行,经过理论、事例的讲解和演示,让学生能够清楚到实践的操作,掌握本课程的有关知识。图表表示以下教课方法理实联合法教课议论教课法方法
解说法对照法事例教课法任务驱动法事例教课法:教课过程中。老师举例子解说一个网站创立的过程和方法,其余有关类网站的创立就能够用第一个网站建设中的一些方法去达成。议论式教课:着重讲堂教课整体设计,经过引入问题,如建设网站的市场剖析,能够55v1.0可编写可改正组织学生经过议论找寻答案,让学生参加交流、分享自己的见解,并进行总结和概括。经过议论,学生真切做到了踊跃参加讲堂学习。剖析问题、解决问题的能力,又增强了理论知识在实质的应用。还有其余的一些方法如解说法、任务驱动法等,再此就不多说。二、课程目标课程的整体目标经过本课程的学习,使学生掌握网页设计的整个工作流程和方法,能够使用网页三剑客及其余有关软件达成网站前端有关工作(如网页成效图制作、网页布局、用代码生成网页等),在教课过程中,经过团队开发,形成基本的职业道德规范和职业修养,及团队合作精神。三、内容标准第一章HTML网页基础教课内容一、[教课目标和要求]1、目的:1)掌握HTML文件编写方法;2)使用阅读器阅读HTML源文件;3)认识html基本观点2、要求:掌握常用的阅读器翻开网页方法(IE、火狐、360阅读器、谷歌阅读器等),掌握网页设计的一些基本观点;二、[教课要点与难点]要点:网页设计有关观点难点:网页设计有关属性三、[教课方法与手段]解说、事例演示、实质操作、作业66v1.0可编写可改正经过理论解说的方式让学生认识本章的理论的内容四、[内容部分]1、经典网页赏识1)蓝色代表海洋,宇宙,海洋。是一种广博的颜色。此网页采纳主色为蓝色。代表了一种广博的精神。也代表了本公司的科技领域强处。不一样的蓝色的变换给人一种轻松的感觉。网页右侧加以黄色地区来衬托出产品的外形,以及独到。网页整体简单了然。正是这类公司所需要的。2)网页是一则汽车的网页,和传统汽车网页同样采纳黑色的背景,突显出一种尊贵,科技的感觉。文章的文字部分采纳高妙度灰色,表现了主题。汽车轮子处的火,表现了激情,兴奋。使主题更为生化一步。给人隆重庄重的同时,不失激情活跃的一面。2、网页设计有关观点1)一致资源定位器(绝对路径、相对路径)2)超链接3)网站、静态网页、动向网页、主页、网页三剑客4)Html语言观点5)常有的阅读器6)Html语言的基本构造及语法五、[作业]1)使用阅读器翻开网页源代码;2)写出html超文本标记语言的主体构造;第二章文字与段落标记教课内容77v1.0可编写可改正一、[教课目标和要求]1、目的:1)掌握网页中文字编排、美化方法;2)掌握网页中图像插入的方法2、要求:1)掌握标题标记2)掌握文本基本标记、文本格式化标记3)掌握段落标记、水平线标记二、[教课要点与难点]要点:掌握文本基本标记、文本格式化标记难点:单、双标记的划分三、[教课方法与手段]解说法、事例演示、议论法四、[内容部分]1、设置段落的标记段落标记是一个双标记,每个标记对表示一个段落;语法格式:<p>这里表示段落</p>2、换行标记换行标记是单标记,即不会成对出现,是在尖括号中加一个</br>的单标记;语法格式:.</br>3、给代码增添说明增添说明是不会再网页中显示的语法格式:<!——说明——>4、粗体和斜体1)粗体标记,是一对双标记,起到重申的作用88v1.0可编写可改正语法格式:<b>标题文字</b>2)斜体标记语气较弱语法格式:<i>表示斜体标记</i>5、下划线与删除线标记为了使部分文字特别显示,能够使用下划线或许删除线标记,也是一对双标记;语法格式:<u>下划线的</u><s>删除线的</s>6、上标和下标双标记语法格式:<sup>上标</sup><sub>下标</sub>H2o;H2so4;a2+b2=c27、文字标记:是一个双标记语法格式:<fontcolor=”颜色值”>文字</font>8、标题标记对齐属性h1-h6(h1:表示文字标题最大—h6表示文字标题最小)对齐属性:align(left、center、right)如:<h1align=“center”>标题居中</h1>9、文本标记的属性1)字体属性face如<fontface=“需要的字体”>云南城市建设职业学院</font>设置字体大小属性:size如<fontsize=“值”>云南城市建设职业学院</font>绝对值:1-799v1.0可编写可改正相对值:-4—4的整数,字体有关于3号放大和减小字号注意:属性与属性之间用空格分开3)字体的颜色属性:color如<fontcolor=“颜色值”>云南城市建设职业学院</font>能够用英文单词或许二进制代码10、粗体标记:b与strong语法格式:<b>需要加粗的文字</b><strong>需要加粗的文字</strong>标记是能够嵌套的11、斜体的标记i、em、cite语法格式:<i>需要变成斜体的文字</i><em>需要变成斜体的文字</em><cite>需要变成斜体的文字</cite>12、大字号和小字号标记big和small语法格式<big>需要加大的文字</big><small>需要加大的文字</small>加大:在本来定义的字体大小基础上加大一个级别;变小:在本来定义的字体大小基础上变小一个级别;13、不自动换行的标记1)nobr语法格式:<nobr>不换行的文字</nobr>1010v1.0可编写可改正14、水平线标记1)<hr/>水平线标记的属性:width(宽度)、color(颜色)、size(高度)、noshade(无阴影)、align(对齐)15、其余特别标记1)空格: <;<>;>五、[作业]制作一个公司简介页面(包含标题、文字、下划线、图片、橫线)第三章使用图像教课内容一、[教课目标和要求]1、目的:1)掌握网页中图形图像的格式;2)掌握网页中图像插入的方法及图像的超链接;2、要求:1)掌握常用图像的格式2)掌握网页中插入图像的方法,及插入图像的标记二、[教课要点与难点]要点:网页中图像插入的方法及图像的超链接难点:超链接中图像的地点三、[教课方法与手段]解说法、事例演示、议论法、习题法1111v1.0可编写可改正四、[内容部分]1、常有的一些图像格式1)jpeg压缩图像格式,不支持透明,1670万像素,图像要求比较绚烂的时候使用;2)Gif(图形互换格式)支持透明,256色,支持动画(由多张位图连续播放形成)3)Png(firework)支持透明1670万像素,是网络可移植格式;2、怎样在网页中插入图像<img>:单标记语法格式:<imgsrc=“地点”>Src:表示指定图像的地点(路径)绝对地点:拥有详尽的地点,即供给目标文档的完好主机名称、路径信息、及文档的全称;相对地点:从目前文档开始的地点1)假如目前文档和目标文档地点平行,则直接书写目标文档的全称;2)假如目前文档和目标文档文件夹地点平行,则输入路径为文件夹名称目标文档名称3)假如目前文档所在文件夹和目标文档地点平行,则书写:目标文档全称3、属性:1)alt属性语法格式:<imgsrc=“地点”alt=“显示图片信息”>2)图像宽度高度属性:width、height<imgsrc=“地点”alt=“显示图片信息”width=“属性值”>1212v1.0可编写可改正3)vspace(垂直间距)、hspace(水平间距)五、[作业]制作一个图文并茂的婚纱网页(素材图片自己到互联网上找)第四章使用列表教课内容一、[教课目标和要求]1、目的:1)掌握有序列表;2)掌握无序列表2、要求:1)认识列表标记2)掌握有序、无序、定义、菜单列表的使用方法二、[教课要点与难点]要点:列表标记难点:有序、无序列表浮动的使用三、[教课方法与手段]解说法、事例演示、习题法四、[内容部分]1、列表的使用定义说明:列表是一种数据的摆列方式,对页面的布局特别重要,分为三类:有序列表、无序列表、自定义列表。无序列表:项目符号由几个符号构成有序列表:项目符号由字母、数字摆列构成自定义列表:经过自己灵巧定义1)有序列表1313v1.0可编写可改正语法格式:<ol><li>表示列表项1</li><li>表示列表项2</li><li>表示列表项3</li></ol>难点说明:本列表会自动换行,不用加换行符号,假如非要成一行,那么就给他加上css定义浮动;有序列表的序号种类(1、a、A、i、I)默认状况下是数字;语法格式<oltype=“序号种类”><li>表示列表项1</li><li>表示列表项2</li><li>表示列表项3</li></ol>设置列表的开端数值<oltype=“序号种类”start=“开端数值”><li>表示列表项1</li><li>表示列表项2</li><li>表示列表项3</li></ol>注意:start=“开端数值”中开端数值一定为数字,不然不起作用;2)无序列表无序列表的项目摆列没有次序,以符号作为分项表记;语法格式<ul>1414v1.0可编写可改正<li>列表项1</li><li>列表项2</li><li>列表项3</li></ul><ul>和</ul>分别表示无序列表的开始和结束,<li>表示列表项;b)无序列表的列表种类(实心圆、空心圆、方框)disc\circle\square)无开端数值属性3)目录列表显示成效与无序列表同样,一般用来创立多列目录语法格式<dir><li>列表项1</li><li>列表项2</li><li>列表项3</li></dir>种类<dirtype=“种类”><li>列表项1</li><li>列表项2</li><li>列表项3</li></dir>列表种类(实心圆、空心圆、方框)disc\circle\square)无开端数值属性4)定义列表语法格式<dl>13211515v1.0可编写可改正<dt>定义条件1</dt><dd>定义描绘1</dd><dt>定义条件2</dt><dd>定义描绘2</dd><dt>定义条件3</dt><dd>定义描绘3</dd></dl>5)菜单列表用于设计单列菜单列表,显示成效与无序列表同样;语法格式:<menu><li>列表项1</li><li>列表项2</li><li>列表项3</li></menu>五、[作业]1、输入五组列表(无序、有序、自定义、菜单、目录列表)代码;并给每组第一个列表项加上超链接,链接目标自定。第五章使用表格教课内容一、[教课目标和要求]1、目的:1)掌握创立表格的方法;2)掌握表格属性2、要求:1)掌握创立表格方法;1616v1.0可编写可改正2)掌握表格边框、背景、行、列属性二、[教课要点与难点]要点:创立表格难点:归并单元格三、[教课方法与手段]解说法、事例演示、习题法、问题法四、[内容部分]1、成立表格用到的四个标记1)table,是双标记,用于定义表格元素,<table>和</table>;2)tr是双标记,用于定义表格的行;<tr>和</tr〉3)td是双标记,用于定义表格的单元格;<td>和</td>4)th是双标记,用于定义表头;<th>和</th>2、语法格式<table><tr><th>第一行第一列单元格</th><th>第一行第一列单元格</th><th>第一行第一列单元格</th></tr><tr><th>第一行第一列单元格</th><th>第一行第一列单元格</th><th>第一行第一列单元格</th></tr></table>1717v1.0可编写可改正姓名性别年纪张三丰男25总结:<th>与</th>表示表头,里面的内容,自动加粗、自动居中;<td>和</td>表示单元格,里面的内容不加粗,不居中;3、<table>标记属性1)、border:表示表格的边框属性,属性值为数值;border="数值";)、width:表示表格宽度属性(属性值示数值或许百分比))、height:表格高度属性(属性值示数值或许百分比)4)、bgcolor:设置表格背景颜色的属性属性值能够是英文单词、也能够是rgb或许cmyk颜色值)、background:用于设置表格背景图像属性;属性值:就是设置背景路径值(建议使用相对路径)6)、cellspacing:用来设置表格间距,属性值是数值;7)、cellpadding:用来设置表格边距,属性值是数值;8)align:用于设置表格对齐的属性:属性值:left\right\center(左对齐、右对齐、居中对齐)4、表格行的控制)width:表示行的宽度(属性值示数值或许百分比))height:行高度属性(属性值示数值或许百分比))align:设置行中文字对齐方式;)vlign:文字垂直方向对齐)bgcolor:设置表格行背景颜色的属性属性值能够是英文单词、也能够是rgb或许cmyk颜色值6)bordercolor:设置表格行边框颜色5、td单元格的属性控制1)align、vlign:单元格中水平、垂直方向文字对齐方式;1818v1.0可编写可改正2)bordercolor:单元格边框属性)bgcolor:单元格背景颜色)rowspan:表示单元格跨行的行数)colspan:表示单元格跨列的列数五、[作业]作业1、用html标记语言中表格标记和属性等达成上图所示表格;2、用html标记语言中表格标记和属性等达成本班级课程表;第六章使用成立超链接教课内容一、[教课目标和要求]1、目的:1)掌握超链接的基本知识;2)掌握超链接成立方法2、要求:1)掌握网页内部链接方法;1919v1.0可编写可改正2)掌握网页外面链接方法;3)掌握锚点链接方法二、[教课要点与难点]要点:外面链接、内部链接方法难点:链接时路径的正确书写三、[教课方法与手段]解说法、事例演示、习题法四、[内容部分]1、路径的观点:路径分为相对路径和绝对路径相对路径以引用文件的网页所在的地点为参照基础而成立的路径如:1)假如链接到同一目录下,则直接输入要链接的文档的名称;2)假如链接到下一级目录中的文件,则先输入目录名,而后再加“/”,在输入文件名假如链接到上一级目录中的文件,先输入“../”再输入目录名、文件名绝对路径()绝对路径是以站点的根目录为参照基础的目录路径在www中以http开头的链接都是绝对路径说明:当链接到本机器上的文件时,建议使用相对路径,假如使用绝对路径,当把文件挪动到其余盘符后,那么链接就会无效,这样就要对文件链接从头编写才能使用。3、成立超级链接文字1)格式<a>要链接的文字</a><ahref=“路径”>要链接的文字</a><a>:表示链接的开始2020v1.0可编写可改正</a>:链接的结束href:定义文件链接的地点(路径、地点)2)Target用于指定翻开链接的目标窗口,默认方式是在本来的窗口中翻开-blank:在阅读器新的窗口中翻开;-parent:将链接的文件载入含有该链接框架的副窗口中翻开;-self:在同一框架中翻开-top:在目前整个阅读器窗口中翻开格式:<ahref=“路径”target=“-blank”>要链接的文字</a>图像的链接要将图片做成超链接,只要将<img>标记放在<a>和</a>之间即可;格式:<ahref=“链接图片地点”><imgscr=“参数”></a>邮箱的链接格式:<ahref=“mailto:E-mail地点”cc=“抄送人E-mail地点”&subject=“邮件主题”&body=“邮件正文”>描绘文字</a>如:<ahref=“mailto”cc=“”&subject=“祝愿”&body=“十一节快乐”>写信</a>站内链接假如一个页面很长,找寻相应内容比较困难,就能够使用站内链接格式:<ahref=“#目标名称”target=“窗口名称”>目录文字</a>在链接的目标处使用<aname=“目标名称”>超链接目标</a>五、[作业]2121v1.0可编写可改正1、做一个脑筋急转弯页面的站内链接(起码10个)2、做一个图片链接页面3、做一个文字链接页面(标题的)第七章增添多媒体教课内容一、[教课目标和要求]1、目的:1)掌握常有的媒体文件格式;2)掌握插入多媒体方法2、要求:1)设置转动文字方法;2)掌握插入音频、视频文件方法;3)掌握设置网页背景音乐方法二、[教课要点与难点]要点:音频、视频文件方法难点:转动文字设置、鼠标控制(停止、运动)三、[教课方法与手段]解说法、事例演示、习题法、发问法四、[内容部分]、转动字幕使用转动字幕能够增添网页的动感,让网页显得更有生气,达到动感实足的成效;<marquee>是一个双标记语法格式:<marquee>文字</marquee>属性:direction、beavior、loop、scroollamount、scrolldelay、align、bgcolor、2222v1.0可编写可改正height和width、hspace和vspace1)direction:用于设置转动文字挪动方向属性值:left(右向左挪动)默认值right(左向右挪动)up(下往上挪动)down(上往下挪动)2)behavior:用于转动文字的挪动成效;属性值:Scroll:周而复始转动;Slide:表示转动到一方后停止,只转动一次;alternate:表示转动一方后向相反方向转动,交替进行3)loop:用于设置转动文字的循环次数,假如未指定,则循环不只;4)scrolldelay:用于设置每次转动的间隔的延缓时间,一般以毫秒作为单位5)align:用于设置转动文字的对齐方式top:顶对齐middle:中间对齐bottom:底部对齐6)bgcolor:用于设置转动的背景颜色;7)height和width用于设置转动文字的高度和宽度8)hspace和vspace用于设置转动文字周围的水凭空间和垂直空间怎样实现鼠标光标挪动到滚文字上停止转动;移开鼠标连续转动成效;Onmouseover=“javascript:()”表示鼠标经过停止;Onmouseout=“javascript:()”表示鼠标移开连续运动;2、怎样嵌入多媒体文件:2323v1.0可编写可改正网页中嵌入的多媒体不只有文字、图像还有音频、视频、flash动画等文件1)使用<embed>标记嵌入多媒体文件(是一个单标记)属性说明:src用于指定媒体文件的地点Height和width用于设置媒体文件的高度和宽度Loop用于设置媒体文件的播放次数Hidden用于隐蔽播放器五、[作业]、制作一网页,在网页中插入转动文字、视频、音频文件(素材自备)第八章使用表单教课内容一、[教课目标和要求]1、目的:1)掌握表单标记;2)掌握菜单和列表使用方法;3)掌握文本框、文本域使用方法2、要求:1)熟习表单对象;2)熟习表单标记及其属性;二、[教课要点与难点]要点:表单观点、表单对象成立方法难点:密码框成立、菜单、复选框成立方法三、[教课方法与手段]解说法、事例演示、习题法、发问法四、[内容部分]2424v1.0可编写可改正1、成立表单1)表单是实现交互式动向网页的一种主要的外在形式,是网站管理者与浏览者之间交流的桥梁,其主要功能是采集信息;由<form>标记来定义;2)格式<from>..</form>属性共有三个name属性:“form-name”method属性:get和postaction属性:表单办理程序的地点3)输入标记<input>标记是表单中输入标记,是一个单标记,语法格式以下:<inputname=“”file-name”type=“type-name”>4)文本框单行文本框:当type的属性值为“text”时表示输入项输入的字符串是以单行显示;value:定义文本框初始值size:定义文本框长度maxlength:定义输入最大字符串数如:联系方式:电子邮件:联系地点:手机号码:电话号码:QQ:5)密码框如:用户登录2525v1.0可编写可改正用户名:输入密码:当type属性的值:为password时表示的是密码框,其余属性与text相像,不一样之处,输入的内容均以*表示,保证密码的安全性语法格式:<inputtype=“password”name=“”file-name”maxlength=“数值”>2、按钮表单中的按钮起着至关重要的作用,主要有三种种类:一般按钮、提交按钮、重置按钮;1)一般按钮当type的属性值为button时表示该输入项输入的是一般按钮,语法格式以下:<inputtype=“button”name=“file-name”value=“button-value”>注意:value表示显示在按钮上边的文字2)提交按钮当type的属性值为submit时表示该输入项输入的是提交按钮,语法格式以下:<inputtype=“submit”name=“file-name”value=“submit-value”>3)重置按钮当type的属性值为reset时表示该输入项输入的是重置按钮,语法格式以下:<inputtype=“reset”name=“file-name”value=“reset-value”>3、单项选择框与复选框1)单项选择框当type的属性值为radio时表示该输入项输入的是单项选择项,语法格式以下:<inputtype=“radio”name=“file-name”value=“value”>2626v1.0可编写可改正2)复选框当type的属性值为checkbox时表示该输入项输入的是复选项,语法格式如下:<inputtype=“checkbox”name=“file-name”value=“value”>4、文件输入框当type的种类为file表示输入项是一个文件输入框,用户能够在文件输入框内部填写自己硬盘中文件的路径,而后经过表单上传;格式:<inputtype=“file”name=“file-name”>五、[作业]、使用表单标记创立以下密码框用户登录用户名:输入密码:第九章使用框架构造教课内容一、[教课目标和要求]1、目的:1)掌握框架的使用方法;2)框架的属性;2、要求:1)掌握框架的使用方法;2)掌握框架的链接;二、[教课要点与难点]要点:框架的属性难点:框架的链接2727v1.0可编写可改正三、[教课方法与手段]解说法、事例演示、习题法四、[内容部分]框架的作用:往常用于页面导航;框架1、框架集<frameset>..<frameset>2、框架<frame><frame>框架集:用<frameset>..<frameset>标记来定义,用于定义网页显示的框架数目、大小等其余属性;框架:用<frame><frame>标记定义,定义的是网页上一个显示的地区3、语法格式:<html><head><title>.</title></head><frameset><framesrc=“url”/><frameset><html>说明:框架文档的书写格式与和html文档的书写格式基真同样,独一不一样的是使用frameset标记替代了body标记4、框架构造1)左右构造2)上下构造3)嵌套构造左右构造:采纳cols属性,即在垂直方向将阅读器切割成多个窗口2828v1.0可编写可改正语法格式:<framesetcols=“value”,“value”,.><framesrc=“url”/><framesrc=“url”/></frameset>Value值能够是数值也能够是百分比,还能够混淆;数值之间用逗号“,”进行切割,有几个值则说明窗口就被切割成几个部分;上下构造:采纳rows属性,即在水平方向将阅读器切割成多个窗口语法格式:<framesetrows=“value”,“value”,.><framesrc=“url”/><framesrc=“url”/></frameset>比如:将网页页面水平切割成三个部分(10%,20%,60%)嵌套构造:既有左右切割,有上下切割语法格式:<framesetrows=“value”,“value”,.><framesrc=“url”/>.<framesetcols=“value”,“value”,.><framesrc=“url”/></frameset></frameset>2929v1.0可编写可改正例:将网页切割成田字形2、框架集的属性设置窗口框架宽度border语法格式:<framesetrows=“value”,“value”,.Border“”><framesrc=“url”/><framesrc=“url”/></frameset>设置边框颜色bordercolor语法格式:<framesetrows=“value”,“value”,.border=“value”bordercolor=“color-value”><framesrc=“url”/><framesrc=“url”/></frameset>设置框架隐蔽frameborder语法格式:<framesetcols=“value”,“value”,.frameborder=“值”><framesrc=“url”/><framesrc=“url”/></frameset>值为:0或许1,0表示不显示边框,1表示显示边框,默认状况下值为13、框架属性3030v1.0可编写可改正scr:用于设置框架显示的文件路径;语法格式:framesrc=“url”/>,假如没有src属性则表示该窗口显示为空白name用于定义框架的名称语法格式:<framesrc=“url”name=“”/>frameborder属性用于显示框架,值与框架集同样scrolling属性用于设定能否有转动条value值有两个“yes”和“no”“auto”语法格式:<framesrc=“url”name=“”scrolling=“vlue”/>noresize属性用于用户可否自己调整框架窗口大小语法格式:<framesrc=“url”name=“”scrolling=“vlue”noresize/>注意:此属性无属性值marginwidth属性,用于设定内容与框架的距离语法格式:<framesrc=“url”name=“”marginwidth=“vlue”/>marginheight属性,用于设定框架边沿高度语法格式:<framesrc=“url”name=“”marginheight=“vlue”/>五、[作业]1、用框架将页面切割成左右两个部分(20%,80%),而后再把右部上下切割成相等两个部分,并设置左侧框架名称为left,并且左侧框架窗口显示转动条,右侧窗口不显示转动条,左侧框架上部分连结到右框架上部分接到;第十章使用css款式表教课内容一、[教课目标和要求]3131v1.0可编写可改正1、目的:1)掌握css款式表使用方法;2)掌握css分类;3)属性的使用2、要求:1)css款式表使用;2)掌握css分类及其属性;二、[教课要点与难点]要点:款式表的使用难点:款式表的名称定义三、[教课方法与手段]解说法、事例演示、习题法四、[内容部分]、认识cssCss又称层叠款式表,是一种此刻大家都使用的网页技术,为大多阅读器支持,成为网页设计必不行少的工具;2、款式表构成)选择符此组款式编码所要针对的对象,能够是一个标记如(body,h1等),也能够是定义了的id或class标记;2)款式属性:颜色、大小、定位、浮动等3)值:指定值、数字、百分比3、款式表种类外联款式表、内联款式表、内嵌款式表4、语法格式如:3232v1.0可编写可改正)<pclass=“h”>.</p>款式表格式:.h{..}<pid=“h”>.</p>款式表格式:#h{..}五、[作业]1、应用外联款式表对页面进行简单布局;四、《网页设计》实训部分1、实训目的与要求《网页设计dreamwvaver综合实训》主要目的是让学生经过这门实践课程的学习了解和掌握网页设计的基本方法和技巧,经过不停上机实践训练达到能够娴熟顺利达成网站的制作。掌握网站设计流程、技巧,集中实践使学生综合运用所学习的网页设计知识及从前所学习的计算机方面的知识,依照网站制作的流程,达成一个详细、综合性的网站;稳固学生系统性的知识,培育学生解决实质问题的能力,锻炼互相合作的工作能力,提升学生综合素质。2、实训内容1)实例实训(绿色食品、手机、餐饮、美容)以绿色食品网站设计的实例指导学生怎样独立达成食品网站站点的设计和制作。让学生在机房实质操作,依照给定的实例达成实例中整个站点页面的创立和设计。2)自建站点实训(绿色食品、手机、餐饮、美容)让学生自行选择站点的主题,从规划站点到一步一步达成整个站点的规划、设计、创立、调试等工作。3)总结3333v1.0可编写可改正对学生的所有作品进行批阅,并选择事例对实训的结果进行查核。3、参照步骤实训内容实训课时实训说明、知识回首基本知识回首实训作品策划、规划书整体布局设计采集和创立资源成效图制作程序设计首页模板设计二级页面模板设计各页面的细化、测试改正文档总结4、实训准备1)软件准备Dreamweaver、firework、PhotoShop、logomaker、Flash中文版(本实训对FLASH技术不做要求)。2)硬件准备网络条件:与因特网连结的局域网。(最好不带复原的计算机)教师用机:Windowsxp或win7及以上版本。学生用机:Windowsxp或win7及以上版本。5、考查方法网站规划书10分成效图设计20分编写代码30分3434v1.0可编写可改正实训出勤20分技术含量10分整体雅观一致搭配10分6、实训内容说明由实训指导教师自行选择网站作为实例,实例要求以下:选择公司绿色食品网站或许其余公司网站。站点模块功能清楚,能反应各模块的基本功能、构造清楚、风格一致、色彩一致。为了便于教课,站点应当拥有大热dreamweaver页面布局、链接、CSS+div样式等网页设计制作中常用的知识点和操作。7、内容1)解说和演示整个站点的制作过程和设计方法。2)、学生自由组队(三人一组分工合作),也能够一人一组,最多不超出三人。8、实训步骤(学生实训周内达成)1)达成整个站点规划(规划书)、包含色彩、logo站点风格策划;2)素材、文档资料采集3)成效图制作(firework或ps、flash)4)页面设计、页面布局(dreamweaver、css+div)5)程序设计、调试6)模板成立7)应用模板生成有关二级页面8)测试链接等达成站点成立9)总结除内容外还包含对在实训中有什么收获、有什么困难等内容五、实行建议教课建议3535v1.0可
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
评论
0/150
提交评论