本帖最后由 逆风TO 于 2019-9-4 09:52 编辑
一、语言
教程:
https://www.runoob.com/
https://www.w3school.com.cn/tags/att_label_for.asp
1.HTML
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 与哪个表单元素绑定。)类似:<label for="male">Male</label>
2.1 内外样式表对比
2.1.1 内部样式表
直接用style属性标签内嵌于html中:
1.行间式#
<p> style="color:red;"</p>
1
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">显示日期</button>
</body>
</html>
jQuery 是一个 JavaScript 库,它极大地简化了 JavaScript 编程。
4.php内嵌于HTML
由于PHP属于脚本语言,很难直接定位函数定义处,在eclipse中导入php项目文件夹后可以ctrl+左键定位函数位置。
5.JSP内嵌于HTML
(JSP本人没接触过,此处省略……)
6.ASP.net和C#
(本人接触少,略……)
——以上代码主要来源于菜鸟教程。
二、框架
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/
php还有很多不同功能的网站系统,比如
limesurvey:(非常强大的开源问卷系统)
https://www.limesurvey.org/fr/
三、环境
一般来说,要配环境的都是动态网页——
动态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.JSP的tomcat容器\servlet
JSP:全名为Java Server Pages,中文名叫"java服务器页面",其根本是一个简化的Servlet设计
四、工具
1.浏览器的开发模式f12
网络:用来查找网络资源加载时间
源(又名 存储):查找网络资源
元素(又名 查看器):方便改样式表,(点击左侧指针按钮可以定位元素和样式表)
在右边的“规则”里,可以实时修改css代码并在浏览器上看到效果(css文件不会被修改,刷新就没效果了),所在的css文件名和所在行数也有显示。(开启工作空间后可以直接在浏览器改代码并保存)
2.各种集成开发环境或文本编辑器
idea在构建时要注意UTF-8是否带BOM;浏览器、tomcat版本也可能导致项目乱码。
|
|