1.了解什么是WEB
2.了解什么是WEB前端
3.学习和掌握开发环境的搭建
4.网页开发基础
1.什么是WEB
1946年，有一个发明了人类史上第一台完整体系的计算机
时间进展到1989年，实验室有一个研发人员 Tim·Berners·Lee（提姆·博纳斯·李）开始思考一个问题
-
问题：以前的计算机，都是独立运行的法器，自己计算机上的数据无法迁移到其他的计算机上的！这是个问题！
-
经过大量的尝试，终于1990年发布了全球第一个网站/网页
http://info.cern.ch -
联合其他技术专家，成立了
WWW万维网组织 -> W3C组织 -
1990年，称为WEB元年
WEB，工作在互联网上的应用，可以通过互联网(www)实现数据的传输和共享
2.什么是WEB前端
WEB前端就是软件界面的开发技术，主要使用各种技术开发网页视图。
3.学习和掌握开发环境的搭建
开发工具
推荐使用VScode工具编写代码
笔记软件
笔记软件推荐使用Typora
操作
可以去创建一个文本文档
可以在文本文档内进行编写后将扩展名从.txt改成.html或者.htm
例如
，
然后Ctrl+s保存退出修改扩展名为.html，如图
双击打开结果如图
也可以创建一个文件夹进入CScode打开，个人感觉在code里面打开先创好的文件夹比在code里面创文件夹要更方便
4.网页开发基础
| 标签 | 说明 |
| <!DOCTYPE html> | 网页文档的声明标签，用于声明当前文件是一个网页，一般写在第一行 注意：固定语 |
| <html></html> | W3C约定：网页中所有的内容，都包含在一对 html 标签内部 注意：固定语法；类似生活中存放所有收纳盒的房子 |
| <head></head> | W3C约定：网页特征数据，包含在一对 head 标签内部 |
| <title></title> | 网页标题标签，给网页设置选项卡上显示的内容；约定包含在 head 标签中 |
| <meta charset="UTF-8"> | 网页编码标签(独立标签)，设置网页正确显示字符的标签；约定包含在 head 标签中 |
| <body></body> | W3C约定：网页窗口与中显示的所有内容，都包含在一对 body 标签内部 |
代码示例
<!-- 注释：代码中用来解释给开发人员的文字，不会参与代码运行-->
<!-- doctype标签，用来声明这是一个网页文档；默认写在第一行-->
<!DOCTYPE html>
<!-- 网页中所有的内容，约定包含在一对html标签中 -->
<html><!-- 网页文档本身特征：标题、编码、搜索词等等，约定包含在一对head标签中 --><head><!-- title标签，用来声明网页的标题 --><title>我的第一个网页</title><!-- meta标签，用来声明网页的编码-正确的显示中文 --><meta charset="UTF-8"></head><!-- 网页窗口中显示的所有内容，约定写在body(身体)标签中 --><body><!-- 网页中展示的内容 -->窗前明月光地上鞋两双....</body>
</html>移动端
移动端：泛指手机、平板屏幕上查看网页视图，将这种屏幕称为移动端视图
移动端如何正确的显示网页
代码示例
<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><!-- 让网页内容根据视图窗口的大小自动缩放：适配移动端 --><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body>可以在一个新的html网页中输入一个英文感叹号，然后回车自动生成完整的结构化标签
</body>
</html>
