学习任务

     制作大国工匠页面  

     网页来源：中央电视台新闻频道大国工匠专题

     网页效果图（点击查看）

     网页效果演示（点击观看）

      网页设计稿（点击查看）

学习目标

     综合使用CSS各种属性，制作网站常见的左右两列布局的网页

准备工作

1.使用HBuilderX新建项目（点击图像可查看大图）。

  在本案例当中，需要建立一个名为craftsman的文件夹，然后在文件夹中建立名为crafts.html的网页文件，另外建立CSS文件crafts.css，并在crafts.html中链接使用crafts.css文件。

该文件夹内还包括css、img文件夹。

2.准备好制作网页需要的图像。在本案例中，所有用到的图像放在img文件夹中。

观看视频

素材下载

   文字和图像素材（点击下载）

拓展训练

 一、制作山东省生态环境厅网页

  1.山东省生态环境厅网页效果图（点击查看）

  2.山东省生态环境厅素材（点击下载）

  3.参考代码

 二、 制作山东省职业院校技能大赛通知公告页面

  1. 网页效果图（点击查看）

  2.山东省职业院校技能大赛素材（点击下载素材）

  3.参考代码

其他参考页面