一、任务目的
该课程使学生熟练掌握网页编辑过程,综合应用所学的知识,熟练使用 HTML 标记和 HTML5 新增元素，进行网页制作。
二、任务要求
网页制作要合理布局页面，使用相应的页面标记添加页面内容，使页面内容丰富，结构合理，布局美观。
三、任务内容
设计博客页面，页面中结构要完整，布局合理，具体要求如下：
1.页面布局
使用 DIV 对页面进行整体布局。本网站包括：“我的主页(index.html)”、 “ 我 的 日 志 (diary.html)” 、 “ 我 的 相 册 (photo.html)” 、 “ 我 的 资 料四个页面的头部、导航及底部样式相同，网页头部放置自己的头像，文字添加“XXX 的博客”（XXX 为自己的姓名），表头右侧写自己喜欢的格言或个性签名。导航栏均设置下拉菜单，如图 1所示，每个页面的导航需正确链接到相应的页面。网页的正文部分自由设置各个板块。网页底部书写版权信息，文字为“班
2 导航栏样式
3.“我的主页”(index.html)页面正文部分自由添加板块，内容及样式不指定。
4.“我的日志”(diary.html)网页中自由设置日志板块并添加相应内容。内容及样式不指定。
5.“我的相册”(photo.html)页面中至少添加四张自己的照片，合理设置照片的尺寸及间距，实现鼠标放到照片上显示照片信息
6.“我的资料”(information.html)页面中的核心是一个表单，用于填写个 人信息。表单包含单选按钮、复选框、菜单、文件域、提交按钮等控件。实现对
姓名、性别、我的爱好、我的家乡、上传头像的信息收集。表单的发送地址为邮箱：abc@163.com。
7.其他要求
（1）首先创建站点文件夹，然后再创建每一个网页。站点文件夹以“学号+姓名”命名。
（2）站点中用的所有文件，包括网页、图像、音乐、动画等都必须放置在站点文件夹中。
（3）网站的首页文件名应保存为“index.html”或“index.htm”，这是一般服务器默认搜索的站点首页文件名。
（4）网站文件应包含 CSS 样式表，可以设置一个或多个 CSS 文件。
（5）所给网页效果图为范例，网页中除以上具体要求外，所有的文字内容、背景颜色、背景图片、文字颜色、字体、按钮等样式自己任意指定，并实现鼠标悬浮在导航栏及表单上的效果变化。
（6）要求整体结构布局合理，颜色统一美观。
