《Web前端开发技术A》教学大纲.docx

Web前端开发技术A教学大纲适用意围：2O2X版本科人才培养方案涕程代码：08150481课程性质：专业选修深学分：4学分学时：N学时（理论48学时,实验16学时）先修课程：信息处理技术、C程序设计A等后续课程：企业框架开发技术等适用专业：数据科学与大数据技术开课单位：计算机科学与技术学院一、课程说明CVeb前端开发技术A3课程是数据科学与大数据技术专业的一门专业选修课程，以Wch基本概念和Web标准为基准点、通过对Wcb前端士流开发技术的学习和研窕，让学生埋解和靠捏HTM1.基本语法格式'HTMI.5新增元素、CSS基础知识、CSS3的相关知识，通过这门课程的教学,不仅培养学生开发和设计WCb站点的基本技能,更要使学生充分了解Wcb思想、web前端开发的主流框架使用,为送一步学习后续移动应用开发课程打下良好的基础。本课程的主要任务是让学生熟悉W3C规范，理解HTM1.5、CSS3的语法规则，掌握常用的WCb页面布局技术,理解并能如应用HTM1.5CSS3进行页面排版布同，最终能够练合使用所学技术编写符合标准的WCb页面.本课程教学基本要求是让学生理解Wcb设计的基本原则、栏目和网站目录结构定义.开发工具的选用、标准页面布局方法、导肮菜单制作、图文排版、页面交互等方面的基础知识：能够熟练运用HTM1.S中的各种标记语言设计制作网页；熟练常押CSS3对网页进行布同和修饰的葩本方法二、课程目标通过本课程的学习，使学生达到如下目标：课程目标1：/解Web前埼开发技术的相关概念、设计思想、开发技术及发展趋势,具备WCb前端设计的复合知识结构：理情HM1.5.CSS3、JaVaSCnPt等谱法规则、盒模型、HTM1.5+CSS3排版布局的趋咄知识、JS相关框架的使用。课程目标2：理解HTM1.5、CSS3、JaVaSCriPt等语法规则、盒模型、HTM1.5+CSS3排版布局的祇础知识；熟练运刖Web前然多种开发技术，能够完成Web页面开发：掌握网页i殳计与网站开发相关领域的前沿技术，具备能终在Wcb网孙开发领域开展创新性工作的能力。课程目标3：理解Web前皓开发有关的行业标准、常用框架以及相关知识产权、行业政策等：掌提WCb页面设计的基本理论和排版原则、核心知识点：培养学生使用马克思主义的世界观和方法论认识、分析和综合解决问SS的能力：让学生在学好专业知识的同时整定理想信念,不断增强科技强国的使命感和责任1.三、课程目标与毕业要求iWeb前端开发技术A3深程数学目标对数据科学与大数据技术专业毕业要求的支掠见表1,*1课程教学目标与毕业央求关系毕业要求指标点课程目标支捧3.设计/开发解决方案3.3能够在社会、健康、安全、法律、文化等现实约束下,对设计方案的可行性进行研究，并时其进行优选和改进，体现创新意识.课程目标1：了解Beb前端开发技术的相关概念、设计思想、开发技术及发展眄势,具备Web前常设计的强合知识结构：理解IM1.5,CSS3、JavaScript等语法规则、盒模型、InM1.5CSS3排版布局的基础知识、JS相关框架的使用.H6.粳用现代工具5.3能够使用现代工程工具对兔杂软件工捏何SS和设计方案进行预测与模拟，理解其局限性。课程目标2：理解InM1.5、CSS3、JavaScript等语法规则、盒模型、HTM1.5+CSS3排版布局的葩础知识；熟练运用Web前端多种开发技术，能律完成制Cb页面开发：安程网页设计与网站开发相关领域的前沿技术，以备能够在Web网站开发领域开展创新性工作的能力.H6.工程与社会6.2能够分析软件工程与社会各因素之间的关系，合理评价坟杂工程问题时社会、健康、安全、法律以及文化的影响，并理解应承担的货任.课程目标3：理解eb前端开发有关的行业标准、常用框架以及相关知识产权、行业政第等；掌WWeb页面设计的基本理论和律板原则、核心知识点：培养学生使用马克思主义的世界观和方法论认识、分析和综合解决问题的能力；让学生在学好专业知识的同时坚定理想信念,不断墙强科技强国的使命感和贲任感M注：表中-H（MXM（中）-表示遽程与相关毕业要求的关联度.四、教学内容,基本要求与学时分配I.理论部分理论部分的教学内容、基本要求与学时分配见表2。表2教学内容、基本要求与学时分配教学内容假学要求，教学值点难点理论学时实险学时对应的课程目标1.eb前开发技术经述1.1 Ieb概述1.2 Web前流开发职业需求1.3 Web前海开发技术1.4 Web前趟开发工具1.5 浏览器工具教学要求：(D了解Web起源(2)理解呢b特点理解Web工作原理(力掌握Web相关假名，掌握UR1.构成、Seb服务器、超健接基本概念.了解Web前然开发职业需求理解CSS在Web页面设计中作用(7)理解JavaScript在Wob页面设计中作用(8)T?HmDoM、BoM及AJAX在页面设计中的作用(9)了解为Uery含义及解本用途(10)她悉常用五类浏览器安装与使用重点，(D理解HTM1.概念及在网页中的作用.理解HTM1.文档定义.(2)掌握EditP1.uS'AdobeDreamWeaver、Sub1.imeText«IebS1.OrakHBUi1.dCr等开发工具.212HTM1.M2.1 HTX1.文档结构2.2 头部2.3 主体2.4 IHTM1.基本语法2.5 5注/2.6HTM1.文档编写规范2.7HTM1.文档类型<!IK)C11PE>铁学要求：(D掌握两种注徉标记的使用方法及作用，重点掌握!标记的使用.(2)掌握HrM1.代码书写规范(3)掌握UrM1.文档命名规则了解3种InY1.文档类型和HTM1.5的DTD定义方法.(5)掌握综合实例中所使用的标记语法点I(D理解HTM1.文档«1成结构掌握HTN1.头部标记作用及标超标记、元信息meta标记的潘法(3)掌握HnI1.主体标记作用(4)掌握主体标记主要属性及其设置方法(5)掌握标记类型语法及HTM1.风性掌法41、23格式化文本与段落3.1 Web页面初步设计3.2 格式化文本标记3.3 段落与排版标记教学要求(D掌握标遨字标记语法及对齐属性的设置方法(2)掌握£加空格、特殊符号的方法(3)掌握文本惚饰标记的使用方法(力了解计驾机输出标记的使用方法(5)理解引Ff1.和术语标记的使用方法(6)掌握换行、水平分错线、拼音/音标注择ruby标记和rt/rp标记拼音/音标注释ruby标记和ri/rp标记、顶格式化、块引用等标记的使用及闷性设汽点I22(D掌握在body添加文字信息的方法(2)掌握字体font标记的face、size,co1.or属性语法(3)掌握段落p标记谱法及a1.ign属性的设置述表表套衣概列列嵌列表序序表义俄列无有列定12345444444教学要求，(1)了解列表的定义和常用列表的分类了解使用有序列衣项va1.ue属性改变列表项琳号(3)理解列衣的1ype与舛发项type属性冲突时对列表项班号的影晌点I(D掌握无序列吐荔木语法(2)掌握有序列表菸本谙法(3)掌握无序列衣与有序外表嵌套的方法(4)掌握定义列表基本i。法(5)理解定义列表与无序、有序列表的外在我现上的差异难点，U)学会使用列表Iy1.H属性的改变列表的符号样式(2)学会使用列表type,startM性的改变列表的编号样式(3)理解定义列表与无序、有序列表的外在衣观上的差界225超链接与浮动盘架5.1 超链接概述5.2 超链接语法、路里及分类5.3 超链接的应用5.4浮动框架教学要拓(D理解超琏接中路径的分类和应用场合(2)掌握创建HTTP文件下较植接的语法(3)掌握浮动框架使用语法和使用方法，点I(D掌握超琏接电本语法及href,target,tit1.e等属性的设置方法(2)掌握内链接、外链接的定义方法(3)掌握PTP站点访问健接的基本诏法及创建方法(力掌握图像超SJ接的基本语法及创建力法(5)掌握电子邮件於接的基本语法及创建方法(6)掌握竹卷链接的聪本语法及创建方法点1家握14签链接的糜本谱法及创建方法4226图像与多巅体文件&1图像6.2/劝文字&3音频、F1.ash文件(1)掌握img标记基本语法(2)掌樨滚动文字标记的基本语法BAt(1)会利用img属性src,width、height,border*a1.1.、hspace¼YSPaCe、a1.ign等来修饰图像学会利用滚动文字标记的direction,behavior,1.oop,scro1.!amount,Scro1.1.dc1.ay等属性来设置演动文字的效果(3)学会正确设置(anbed标记的src、1.oop、autostart,width、height等性.«At掌握embed标记的语法.222,37CSStftt1.1 1CSS概念1.2 使用CSS控制WebJU1.ftI1.3 CSS继承与层叠*三*.(1)了解CSS基本概含了解传统Hn1.1.的缺点了解CSS的特点了解CSS的优势解CSS编辑方法(6)掌握CSS的基本语法(7)掌握CSS选择滋类型(包括标记选挣寄.类选择器、id选杼器'伪类选择瑞、属性选择器等)(8)理解CSS的继承与层叠区别值点(1)掌握CSS选杼器声明类型(2)掌握CSS定义与引用方法(包括内联样式表(行内样式表八内部样式表、外就样式表(於接外部样式表、导入外部样式表等.)222,38DIV与SPAN8.1div图层8.2图层嵌套与层叠8.3di标记与span标记教学要欢，(1)掌握div定义方法(2)学会设置div图层的制性(3)学会使用多个div进行页面布局(4)学会使用图层嵌套与图层层叠(5)理解div标记与SPan标记的使用区别222、39CSS样式属性9.1CSS属性中的单位9.2CSS字体样式9.3CSS文本样式9.1CSS颜色马背景9.5CSS列表样式9.6CSS盒模型做学聂求，掌握CSS履性中绝对单位与相对单位(2)鸵握字体font-size、font-sty1.efont-variantxfont-weight»font-fa11)iIy等属性的设5S方法(3)学握字体"nt发合M性的设九方法(4)掌握IetIur-SPaCing、text-indenttext-decoration%text-transfoimxIeX1.aIign、vertica1.-a1.ignIinbheiRh等排版样式属性的设置方法(5)掌握颜色属性的设置方法(6)掌握背景backgroundco1.or¼background-imagexbackground-repeatbackground-a11achment、background-position等子属性的设园方422、3法(7)掌握针累夏令属性background的设次方法(8)掌握列表样式语法，学会使用1.ist-sty1.e-type.IiSt