《实践教学进度安排Bootstrap基础教程-实施方案.docx》由会员分享,可在线阅读,更多相关《实践教学进度安排Bootstrap基础教程-实施方案.docx(10页珍藏版)》请在优知文库上搜索。
1、课程教学实施方案填表日期:课程类别_三考核要求:之成绩分配:期5E实一体化:开课时间:第_1_彳核类型(考试/考查)E考试成绩占总分比例60%:平时_周至第全周,周课时4;本学期课时数(学分)72(4)考试,考核方式课程设计。成绩占总分比例40%,其中:书面作业占0%,实践性环节占50%,考勤占50%。本课程授课总时数(总学分)己完成学时数本学期授课总学时数理论教学时数实践教学时数复习机动讲授其它单项技能训练综合技能训练课程设计72(4)07234030602课程教学目的和要求(分述)通过本课程的学习,使学生逐步建立和掌握Web客户端静态页面设计的思想方法,具有分析问题和解决问题的能力,能够使
2、用BOotStr叩框架结合HTML、CSS和JaVaSCriPt编写Web客户端静态页面解决实际问题,具备吃苦耐劳、团结协作的良好品质。教材和参考书1. Bootstrap基础教程2. (Bootstrap实战3. 深入理解Bootstrap,教研室审查意见年月日院(部)负责人审查意见年月日理论教学进度安排周次章、节及内容重、难点(重难点分别说明)教学类型(讲授或其它教学形式)学时数使用教学设备及软(课)件作业1第1章入门准备1.1 Bootstrap概述1.2 Bootstrap主要特色1.3 Bootstrap环境准备1.4 HTML标准模板重点:BOQtSIraP标准模板难点:BOotS
3、traP主要特色讲授2PCDreamweaver/HBuilder1第2章整体架构2.1 整体架构2.2 网格系统2.2.1 网格系统原理重点:网格系统难点:网格系统讲授2PCDreamweaver/HBuilder22.2.2 网格系统基本用法2.2.3 响应式网格2.3CSS组件架构重点:网格系统难点:响应式网格讲授2PCDreamweaver/HBuilder3第3章CSS布局3.1 概述3.2 基础排版3.3 代码3.4 表格样式重点:排版样式难点:表格样式讲授2PCDreamweaver/HBuilder43.5 表单样式3.6 按钮样式重点:按钮样式图片和图标样式讲授2PCDrea
4、mweaver/3.7图片和图标样式难点:表单样式HBuilder53.8Bootstrap辅助样式3.8.1 文本及背景颜色3.8.2 辅助图标3.8.3 浮与居中3.8.4 显示或隐藏内容重点:BootStraP辅助样式难点:漂浮与居中显示或隐藏内容讲授2PCDreamweaver/HBuilder6第4章表单4.1 基础表单4.2 输入框4.3 下拉框4.4 文本域4.5 复选框和单选按钮4.6 表单焦点4.7 表单禁用4.8 验证样式4.9 元素大小4.10 输入框组重点:基础表单、输入框组、验证样式难点:输入框组讲授2PCDreamweaver/HBuilder作业1:构建登录表单7
5、第5章CSS组件5.1 字体图标5.2 按钮组5.3 下拉菜单5.4 按钮下拉菜单重点:字体图标、按钮组难点:下拉菜单讲授2PCDreamweaver/HBuilder85.5输入控件5.6导航5.7导航条重点:输入控件、导航难点:导航条讲授2PCDreamweaver/HBuildere作业2:构建网站导航条95.8路径导航5.9分页5.10标签5.11徽章重点:路径导航、分页、标签与徽章讲授2PCDreamweaver/HBuilder105.12巨幕5.13页面标题5.14缩略图5.15警告框5.16进度条重点:巨幕、缩略图、警告框难点:进度条讲授2PCDreamweaver/HBuil
6、der115.17多媒体对象5.18列表5.19面板5.20洼池重点:列表、面板与well难点:多媒体对象讲授2PCDreamweaver/HBuilder作业3:构建评论列表12第6章JavaScript插件6.1动画过渡效果6.2模态框6.3下拉菜单重点:模态框、下拉菜单难点:模态框、下拉菜单讲授2PCDreamweaver/HBuilder136.4滚动监听6.5标签页重点:滚动监听、标签页难点:滚动监听、标签页讲授2PCDreamweaver/HBuilder作业4:构建可切换标签页146.6提示6.7弹出框6.8警告框6.9按钮重点:提示、弹出框难点:提示、弹出框重点:警告框、按钮难
7、点:警告框、按钮讲授2PCDreamweaver/HBuilder156.10折叠6.11轮播6.12定位浮标重点:折叠、轮播、定位浮标难点:折叠、轮播、定位浮标讲授2PCDreamweaver/HBuilder作业5:构建复杂主页16-18课程设计/机动课程设计/机动讲授2PCDreamweaver/HBuilder实践教学进度安排周次项目名称目的和要求主要内容设施和条件检验形式学时数支撑项目的知识点2CSS定位与漂浮应用CSS优先级CSS盒模型CSS定位与漂浮CSS优先级CSS盒模型CSS定位与漂浮PCDreamweaver/MyEclipseZHBuilder考查2CSS优先级CSS盒模
8、型CSS定位与漂浮3Bootstrap网格系统及布局网格系统用法响应式网格固定式布局流式布局布局嵌套 整体架构 网格系统 CSS组件架构 BOotStraP布局PCDreamweaver/MyEclipseZHBuilder考查2网格系统用法响应式网格固定式布局流式布局布局嵌套4Bootstrap辅助样式应用文本及背景颜色辅助图标漂浮与居中显示或隐藏内容BOoISIraP辅助样式PCDreamweaver/MyEclipseZHBuilder考查2文本及背景颜色辅助图标漂浮与居中显示或隐藏内容5排版样式及表格样式应用排版样式使用表格样式使用排版样式表格样式PCDreamweaver/MyEcl
9、ipseZHBuilder考查2排版样式表格样式6表单样式、按钮样式、图片和图标样式应用表单样式按钮样式图片和图标样式表单样式按钮样式A图片和图标样式PCDreamweaver/MyEclipse/HBuilder考查2表单样式按钮样式图片和图标样式7字体图标、按钮组、下拉菜单应用字体图标按钮组下拉菜单A字体图标按钮组下拉菜单PCDreamweaver/MyEclipse/HBuilder考查2字体图标按钮组下拉菜单8输入控件、导航、导航条应用输入控件导航导航条输入控件导航导航条PCDreamweaver/MyEclipseZHBuilder考查2输入控件导航导航条9路径导航、分页、标签与徽章
10、应用路径导航分页标签与徽章路径导航分页标签与徽章PCDreamweaver/MyEclipseZHBuilder考查2路径导航分页标签与徽章10巨幕、缩略图、警告框、进度条应用巨幕缩略图警告框进度条巨幕缩略图警告框进度条PCDreamweaver/MyEclipseZHBuilder考查2巨幕缩略图警告框进度条11多媒体对象、列表、面板与well应用多媒体对象列表面板与well多媒体对象列表面板与wellPCDreamweaver/MyEclipse/HBuilder考查2多媒体对象列表面板与Wen12模态框、下拉菜单应用模态框下拉菜单模态框下拉菜单PCDreamweaver/MyEclips
11、e/HBuilder考查2模态框下拉菜单13滚动监听、标签页应用滚动监听标签页滚动监听标签页PCDreamweaver/MyEclipseZHBuilder考查2滚动监听标签页14提示、弹出框应用、警告框、按钮应用提示弹出框警告框按钮提示弹出框警告框按钮PCDreamweaver/MyEclipseZHBuilder考查2提示弹出框警告框按钮15折叠、轮播、定位浮标应用折叠轮播定位浮标折叠轮播定位浮标PCDreamweaver/MyEclipseZHBuilder考查2折叠轮播定位浮标1618公司网站设计(课程设计)完成公司网站首页、新闻列表页和新闻主题页面设计公司网站首页新闻列表页新闻主题页PCDreamweaver/MyEclipse/HBuilder考试IOCSSBootstrap备注:L实践教学包括实验、实训、实习、课程设计等实践项目,教师应根据不同专业、不同课程的特点,选取相应的综合技能训练项目。2.根据实践教学的实际需要,教师可适当调整拦目和内容。