一、语言
教程：
https://www.runoob.com/
https://www.w3school.com.cn/tags/att_label_for.asp
1.HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>网站标题</title>
</head>
<body>
<h1>我的第一个标题</h1>
<p>我的第一个段落。</p>
</body>
</html>
2.CSS
推荐：https://www.cnblogs.com/mangM/p/9682845.html
主要用到了HTML的style属性、
class属性和id属性（id 和 class 选择器）、
for属性（for 属性规定 label 与哪个表单元素绑定。）
2.1 内外样式表对比
2.1.1 内部样式表
直接用style属性标签内嵌于html中：
1.行间式#
<p> style="color:red;"</p>
2.内联式#
<style>
p {
color:red
}
</style>
2.1.2 外部样式表
这样将html与样式表有效分离，更易于编辑：
3.外联式#
p {
width: 100px;
height: 100px;
background-color: red;
}
<head>
<link rel="stylesheet" type="text/css" href="css/zero.css" />
</head>
CSS 组合选择符
CSS伪类
3.JavaScript
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
function displayDate(){
document.getElementById("demo").innerHTML=Date();
}
</script>
</head>
<body>
<p id="demo">这里将被显示的日期替换</p> <!-- id是getElementById函数的依据 -->
<button type="button" onclick="displayDate()">显示日期</button>
</body>
</html>
jQuery 是一个 JavaScript 库，它极大地简化了 JavaScript 编程。
4.php内嵌于HTML
由于PHP属于脚本语言，很难直接定位函数定义处，
5.JSP内嵌于HTML
——以上代码主要来源于菜鸟教程。
二、框架
1.前端框架Bootstrap
https://www.bootcss.com/
Bootstrap，来自 Twitter，是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它简洁灵活，使得 Web 开发更加快捷。
2.PHP的CMS——wordpress、dedeCMS
wordpress：
https://cn.wordpress.org
织梦（dedeCMS）:
http://www.dedecms.com/
三、环境
一般来说，要配环境的都是动态网页——
动态web中，程序依然使用客户端和服务端，客户端依然使用浏览器，通过网络连接到服务器上，使用HTTP协议发起请求，现在的所有请求都先经过一个WEB Server来处理。
如果客户端请求的是静态资源，则将请求直接转交给web服务器，之后web服务器从文件系统中取出内容，发送回客户端浏览器进行解析；如果客户端请求是动态资源，则先将请求转交给web Container,在web Container 中连接数据库，从数据库中取出数据等一系列操作后动态拼凑页面的展示内容，拼凑页面的展示内容后，把所有的展示内容交给web服务器，之后通过web服务器将内容发送回客户端浏览器进行解析执行。
在静态web程序中，客户端使用web浏览器经过网络连接到服务器上，使用HTTP协议发起一个请求（Request)，告诉服务区我现在需要得到哪个页面，所有的请求交给web服务器，之后web服务器根据用户的需求，从文件系统（存放了所有静态页面的磁盘）取出内容。之后通过web服务器返回给客户端，客户端接收到内容之后经过浏览器渲染解析，得到显示的效果。
为了让静态web页面显示更加好看，使用javascript/VBScript/ajax.但是这些特效都是在客户端上借助于浏览器展现给用户的，所以在服务器上本身并没有任何的变化
（以上来自 https://www.cnblogs.com/CruxAustralis/p/11254360.html）
总结： 动态内容（诸如： .jsp、.asp/.aspx、.php）的内容需要服务器经过解析、执行数据库等操作后再将处理后的网页反馈给浏览器。
0.Apache
Apache是世界使用排名第一的Web服务器软件。Apache取自“a patchy server”的读音，意思是充满补丁的服务器
1.php集成环境——wamp（web，Apache+Mysql+PHP）
PHP：全名为Hypertext Preprocessor，中文名叫"超文本预处理器”，是一种通用开源脚本语言。
写好的网页要放在特定位置来解析，比如www文件夹里的index.php，否则浏览器输入localhost路径后出现的就只有一个文件夹列表……或者就是403错误。
2.tomcat容器\servlet
JSP：全名为Java Server Pages，中文名叫"java服务器页面"，其根本是一个简化的Servlet设计
四、工具
1.浏览器的开发模式f12
网络：用来查找网络资源加载时间
源：查找网络资源
元素：方便改样式表，（点击左侧指针按钮可以定位元素和样式表）