1. HTML：标签似语言/ CSS：前端框架

2. 处理界面原图

    1）下载Ps：P大官网，免费下载。直接在学校官网用迅雷下载，速度超快，大概10M/s。

    2）将原图分出五部分：banner、bg、login_bg、login_btn、logo

    3）<div> 标签可以把文档分割为独立的、不同的部分。

html源代码

3. 写HTML文档

    1）<meta> 元素可提供有关页面的元信息：https://www.w3school.com.cn/tags/tag_meta.asp

        http-equiv 属性为名称/值对提供了名称。content 属性提供了名称/值对中的值，该值可以是任何有效的字符串。

    2）<link> 标签定义文档与外部资源的关系：https://www.w3school.com.cn/tags/tag_link.asp

    3）<div> 可定义文档中的分区或节：https://www.w3school.com.cn/tags/tag_div.asp

        css中，“#”表示ID名，“.”表示类。

    4）<a> 标签定义超链接，用于从一张页面链接到另一张页面：https://www.w3school.com.cn/tags/tag_a.asp

        其实就是跳转页面

    5）<form> 标签用于为用户输入创建 HTML 表单：https://www.w3school.com.cn/tags/tag_form.asp

    6）<fieldset> 标签将表单内容的一部分打包，生成一组相关表单的字段。

5. id和class的区别：id和class都是属性，不是标签。ID只能用于一个标签，唯一标示；class能用于多个标签，标示一类标签；用后者你可以一次改变很多标签的css属性，很多时候更方便，应用也更广。

6. css样式表

css源代码（未展开）