11-5学院网站制作——网站主页设计（主体部分第二行）.doc

课程名称 WEB前端开发（1） 课次 34 任务、项目、课题名称 学院网站制作—制作主页主体部分（2） 课时 2学时 教学内容 创建主页，搭建主页结构，添加页面各元素 创建外部样式表，设置各元素的样式 教学目标 能够创建主页，搭建主页结构，添加页面各元素 能够创建外部样式表，设置各元素的样式 教学重点 创建主页，搭建主页结构，添加页面各元素 教学难点 创建外部样式表，设置各元素的样式 教学活动及主要环节 导入新课：（2分钟） 上节课给大家留下了制作学院官网首页的第一部分任务这节课我们对主页的第二行部分进行设置。 新授： 第二行左侧通知公告部分（25分钟） （带领同学们一起操作） 分析基本页面结构： div class=notice div class=nTitle h1通知公告/h1 a class=more href=# target=_blank更多/a /div div class=nContent ul li/li …… /ul /div /div 设置CSS样式： 背景、边框、宽度、高度、内边距、外边距 第二行右侧“学院要闻”部分（35分钟） （带领同学一起操作） 基本页面结构： div class=imnews2 div class=newsTitle h1系部动态span class=eng|| nbsp;College News/spanspana class=more href=# target=_blank更多/a/span/h1 /div div class=newsContent div class=newsimg img src=images/11.jpg width=240px height=130px; p class=txta href=# title=捐献爱心 情暖公益——士官学院组织无偿献血活动 target=_blank捐献爱心 情暖公益/a/p /div div class=content ul lispan2018-11-12/spana href=# title=招生就业指导处组织学习2019年招生考试文件 target=_blank招生就业指导处组织学习2019年招生考试文件/a/li …… /ul /div /div 设置CSS样式： 背景、边框、宽度、高度、内边距、外边距…… 总结：（2分钟） 制作网页时按照从整体到部分，从上到下，从左到右的顺序制作 作业： 完成主页的主体部分第二行页面结构以及样式设置。 预习： 超星系统发布任务书，实现主页主体部分第三行的页面结构分析。