Week 01 Training: Fundamentals of HTML & CSS

这是第一周的训练内容

• 请认真阅读以下教程并操作
• 作业以博客形式提交，将写好的博客内容投稿至本专题，文章标题以[W1]开始
• 截止日期：2017年4月7日

目标

• 学会使用HTML和CSS制作页面并对其进行布局

学习内容

• 了解HTML，使用HTML制作一个简单的页面
• 学习常用的HTML标签
• 了解CSS，并将CSS运用于HTML之中
  • 了解CSS的作用和优势
  • 学习CSS基础语法
    • 学习“选择器”
    • 了解可以操作、修改HTML的哪些样式（底色、边框、布局等）
    • 使用css的伪元素
  • 用CSS对页面进行布局
  • 理解为什么不使用Table对页面布局

学习资源

• html在线验证：http://www.freeformatter.com/html-validator.html (该网站上还有很多别的工具）
• html在线格式化代码：http://www.cleancss.com/html-beautify/
• W3School上的HTML基础教程：http://www.w3school.com.cn/html/index.asp
• Html5新特性（了解即可）：http://www.w3school.com.cn/html5/index.asp
• CodeForDream上提供的HTML课程：http://www.codefordream.com/courses/html_basic/sections
• CSS在线验证： http://codebeautify.org/cssvalidate (该网站上还有很多别的工具）
• 学习CSS布局：http://learnlayout.com/
• CSS基础教程：http://www.w3school.com.cn/css/index.asp
• CSS3新特性（了解即可）：http://www.w3school.com.cn/css3/
• CodeForDream上提供的CSS课程：http://www.codefordream.com/courses/css_basic/sections

作业

1. 详细说明下图中的列表是如何实现的

   
   
   

   题1

2. 详细说明下图中的表格是如何实现的

   
   
   

   题2
3. 只使用HTML实现下面的页面，内容必须相同，样式可以不同
   
   

   题3

4. 使用CSS美化上一题的页面，图片供参考

   
   
   

   题4