一、前端简介

制订网页开发的标准:万维网联盟（W3C）,编写的网页都需要遵循W3C的规范

1.网页的结构思想

根据W3C标准，一个网页主要由三部分组成：结构、表现、行为。
c1.
结构、表现、行为

  • 结构（骨架）：HTML用于描述页面的结构。 [比较简单、固定]
  • 表现（皮肤）：CSS用于控制页面中元素的样式。[所有能看见的]
  • 行为（交互）：JavaScript用于响应用户操作。[最难,主要的]
    c3.

二、HTML简介

创建html文件后，输入doc，自动生成
注释快捷键ctrl+/?键（md文件也适用）

1.基本结构

HTML使用标签的形式来标识网页中的不同组成部分

<开始标签></结束标签>
根标签<html></html>
两个子标签<head></head>;<body></body>
<head>的子标签<title></title>
标签一般成对出现，但也存在一些自结束标签:
<img>
<input>

1.1.迭代

网页的版本

  • HTML4
  • XHTML2.0
  • HTML5

1.2.文档声明（doctype）

文档声明用来告诉浏览器当前网页的版本

1
2
3
4
<!-- html5的文档声明 -->
<!doctype html>
<!-- 或者 -->
<!Doctype HTML>

1.3.注释

1
2
3
4
<!--HTML的注释格式-->
        <!--注释中的内容会被浏览器忽略，不会在网页中直接显示，
        可以在源码中查看注释，注释·要求简单明了，注释不能嵌套
        -->
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!-- 文档声明，声明当前网页的版本 -->
<!doctype html>
<!-- html的根标签（元素），网页中的所有内容都要写根元素的里边 -->
<html>
    <!-- head是网页的头部，head中的内容不会在网页中直接出现，主要用来帮助浏览器或搜索引擎来解析网页 -->
    <head>
        <!-- meta标签用来设置网页的元数据，这里meta用来设置网页的字符集，避免乱码问题 -->
        <meta charset="utf-8">
        <!-- title中的内容会显示在浏览器的标题栏，搜索引擎会主要根据title中的内容来判断网页的主要内容 -->
        <title>网页的标题</title>
    </head>
    <!-- body是htm1的子元素，表示网页的主体，网页中所有的可见内容都应该写在body里 -->
    <body>
        <!-- h1网页的一级标题 -->
        <h1>网页的大标题</h1>

    </body>
</html>

2.标签属性

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<html>
    <head>
        <title>标签的属性</title>
    </head>
    <body>
    <!--属性，在标签中（开始标签或自结束标签）还可以设置属性
            属性是一个名值对（x=y）
            属性用来设置标签中的内容如何显示

            属性和标签名或其他属性应该用空格隔开
            属性名和属性值不能乱写，应该根据文档中的规定来编写，
            有些属性有属性值，有些没有；属性值用""或''引起来
    -->

    <h1>这是我的<font color="red" size='3'>第三个</font>网页</h1>
    </body>
</html>