01
web（*）
web前端工程师。
什么是前端（*）
网站：多个网页组成了一个网站。
万维网：无数个网站和网页的集合，它的外国名字叫（world wide web），也简称3w、www或web。
互联网发展过程中，前端和后端好比电视和电视塔的关系。电视塔发送信号（数据），电视接收显示。
合适的地方用合适技术。
合适的地方合适的时间遇到合适人。
前端的重要性（*）
结合现代的时代背景前端主要有如下的作用：
- 实现结合现代人的审美来进行网站页面的设计（90年代、00年代、10年代的页面）。
- 89年的网站界面（最初的Web界面）
* 2000年的网站界面：
* 2010年的网站界面
- 结合大数据环境下的网站前端。
网站越来越大，用户越来越多。就需要在大访问量、大数据量下保证之前的访问速度。
域名和URL地址（***）
我们访问网络要靠IP地址来访问，但是IP地址不便于记忆。
www.youku.com （youku.com）
-
域名
-
域名（英语：Domain Name），简称域名、网域，是由一串用点分隔的名字组成的Internet上某一台计算机或计算机组的名称，用于在数据传输时标识计算机的电子方位（有时也指地理位置）。
我们通常所说的域名由3部分组成：
www.youku.com-
顶级域名
- com，商业机构
- net，网络组织
- org，非盈利机构
- edu，教育
- gov，国家
- mil，军事
- cn，中国
- us，美国
- hk，香港
- tech，学习
-
二级域名
是我们自己花钱注册的。
-
主机名
www这些主机名是我自己定义的。只要容易记忆，你叫什么都行。
www.baidu.com，有一个商业机构baidu。访问的是baidu这个商业机构网站里面的叫www的这台主机。
-
-
网域名称系统（DNS，Domain Name System，将域名和IP地址相互映射的一个分布式数据库）是因特网的一项核心服务，它作为可以将域名和IP地址相互映射的一个分布式数据库，能够使人更方便地访问互联网，而不用去记住能够被机器直接读取的IP地址数串。
-
-
URL
www.baidu.com在网络中叫URL（统一资源定位符），用来表示要请求的资源的具体的地址。http://www.baidu.com:80/test/test.html?par1=var1&par2=var2#p-
http://，协议名，告诉服务器应该用什么数据格式和浏览器进行通信。默认值。 -
www.baidu.com，服务器地址。 -
:80，端口号。端口用来区分数据给定到哪个程序。你可以认为端口就是门。
80端口服务器上面的。80端口是http默认的端口号。 -
/test/test.html，请求的文件路径。根目录下的test目录下的test.html
正斜线表示的是路径分隔符。
-
par1=var1&par2=var2，查询字符串。用来给服务器、后端脚本语言传输参数。基本格式：
名=值一组，如果有多组每组之间使用&符进行分隔。https:// www.baidu.com /s ====== ie=utf8& f=8& rsv_bp=1& rsv_idx=1& tn=baidu& wd=helloworld& fenlei=256& oq=hello%2520world& rsv_pq=80f3bf8f000106f6& rsv_t=8e2eEmlBsaFZLA%2BRKtk%2BlSFntcD5tNuJ9GKQaJdncDvG0lwjtxLtOer9Yd8& rqlang=cn& rsv_enter=1& rsv_dl=tb& rsv_btype=t& inputT=234& rsv_sug3=16& rsv_sug1=17& rsv_sug7=100& rsv_sug2=0& rsv_sug4=702 -
#p，片段标识符。讲HTML的时候我再说。
-
网络软件的组成(**)
web也属于网络软件
-
什么是客户端，什么是服务器端。
- 客户端：能够发起请求，接收服务器端发来的消息的一方，在web中客户端指的就是浏览器。
- 服务器端，接收客户端发来的请求并且给出响应的一方。
-
网站的组成
-
客户端-浏览器
browser，是www服务器的客户端，向www服务器__发送各种请求__，对服务器返回来的网页__进行解释__，相当于翻译官。并且还能够让用户和这些文件__进行交互__。
-
HTML（超文本标记语言）
他用来将网页的各个部分标记出来让浏览器进行解释。
-
CSS（层叠样式表）
HTML用来进行标记，但是标记出来的内容比较混乱，不美观。CSS是用来进行美化的。将HTML的标记合理摆放。
-
客户端脚本语言（JavaScript）
- 脚本：一种程序，他不能独立运行，需要一个载体来运行它。
- 客户端：指的是浏览器。
- 客户端脚本语言：就是在浏览器上运行的脚本语言。
HTML相当于毛坯房、CSS装修、JavaScript相当于装修完成之后安装了各种的智能家居。
-
Web服务器
为了让别人访问所以加入了web服务器。
- 也称为www服务器，通常的服务器端就是指的web服务器，用来像客户端给出反馈。
- 常用的web服务器：Apache、Nginx、IIS。
-
* 服务器端脚本语言
最直观的一种情况，就是我们在使用搜索引擎的时候，搜索给出的结果都是和搜索的关键字相关联的内容。它怎么知道应该给什么内容。
在服务器端进行工作，用来协助web服务器在服务器端完成业务逻辑的编程语言。
java python .net __php__ go Node.js
* 数据库
用来放置数据的仓库。
MySQL 约等于 MariDB Oracle SQLServer DB2......
现阶段我们主要学习的HTML、CSS、JavaScript
当今web的工作方式(**)
较为完整的web可以分为浏览器、HTML、CSS、JavaScript、web服务器、服务器端脚本语言、数据库，而现代的Web多数采用的是前后端分离的架构。
浏览器(*)
浏览器是网页运行的平台，常见的浏览器有 IE 、火狐（Firefox）,谷歌（Chrome）,Safari和Opera等，我们平时称为五大浏览器，第六个是Edge浏览器，是微软改进IE新出的内置浏览器
因为内核的不同才导致有了所谓的5大浏览器。
所谓的内核就是指的渲染引擎，负责对网页语法的解释（如标准通用标记语言下的一个应用HTML、CSS）并渲染（显示）网页。 所以，通常所谓的浏览器内核也就是浏览器所采用的渲染引擎，渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。
不同的浏览器内核对网页编写语法的解释也有不同，因此同一网页在不同的内核的浏览器里的渲染（显示）效果也可能不同，这也是网页编写者需要在不同内核的浏览器中测试网页显示效果的原因。 但它们都需要遵循W3C的标准（HTML5、CSS3、ES标准等等），所以浏览器和浏览器之间会有一些差别，但是差别不大。
-
IE IE是Trident内核。Window发布后，windows10发布以后IE将其内置浏览器命名为Edge,Edge最显著的特点就是新内核。
-
Firefox(火狐) Gecko内核，Gecko的特点是代码完全公开，因此开发程度很高，全世界的程序员都可以为其编写代码，增加功能，可惜这几年没落了，比如打开速度慢，升级频繁，猪一样的队友flash，神一样的对手chrome。
-
Safari 采用的是大名鼎鼎的WebKit。 现在很多人错误的把webkit叫做chrome（即使chrome内核已经是blink，之前采用的是webkit内核）。
-
chrome(谷歌) Blink内核,在Chromium项目中研发Blink内核渲染引擎（即浏览器核心），内置于Chrome浏览器之中，Blink其实是Webkit的分支，大部分国产浏览器最新版用Blink内核
-
Opera Presto内核(已经废弃)是挪威产浏览器opera的“前任”内核，为何说是“前任”，因为最新的opera浏览器早已抛弃投入到谷歌的怀抱了，采用Blink。
-
其他国产浏览器都是在国外浏览器的内核的基础上加上了自己的UI壳子，就成了自己的浏览器了。
现在开发过程中大部分都使用chrome。做开发的90%以上都会用chrome。
什么是HTML（超文本标记语言）(*)
文本标记语言，用标记标识文本。
超文本标记语言可以用一些标记标识出来图片、视频等等。
Hyper Text Mark-up Language，它用标记符号来标识网页中的各个部分。HTML是一种标准，是一种规范。
HTML的发展史(*)
- 是在91年一个叫tim-Lee的写了一份名为HTML的文档，在文档里面他用20多个标记将文字进行标记。这就是传说中的1.0。
- 最早的HTML的官方规范是由IETF（因特网工程任务组）发布的HTML2.0，实际上不存在HTML1.0
- 继IETF之后，W3C（万维网联盟），成为了HTMl后续的标准制定者。90年代中期以后，W3C对HTMl进行了几次升级，直到1999年发布的HTMl4.01
- HTMl4.01后的修订版为xhtml1.0（x的意思为可扩展的），实际上XHTML1.0规范内容与HTML4.01完全相同，没有添加任何新元素或新属性，这两个规范的唯一的差别是HTML语法作出了不同的规定，HTMl为开发人员提供了很大的自由度，可以按照自己的意愿去编写元素和属性，但XHTML要求开发人员遵从XML规则，XHTML1.0规则要求比较严格，要求所有标签和属性都必须为小写。
- 之后为了更加规范，W3C发布了xhtml1.1，但是很多浏览器厂商不配合不检查xhtml的规范
- W3C开始着手开发XHTML2，但是XHTML2与所有的网页内容都不兼容，甚至于以前版本的HTML也不兼容。
- 这时有一些人开始反对XHML2.0尤其是来自opera、apple、moailla的代表，它们希望支持以前的版本并开发一些新功能，但是被驳回。
- 之后他们创建了WHATWG组织，开始开发一些规范，就是HTML5的前身，之后因为XHTML2.0的推进速度不快，人们又不愿意使用。所以W3C开始和WHATWG组织协商接受HTMl5。
- 2014年10月28日，HTML 5.0，W3C正式发布HTML 5.0推荐标准
html4 -》 css2 -》 html5 -》 css3
HTML语法()
-
创建文件、以html结尾。
我们的代码都放在一个目录中。
-
运行
-
对文本进行标记
-
标签
<marquee></marquee>这种东西叫标签。它是HTML最基本的单位，也是最重要的组成部分。标签需要使用两个尖括号抱起来，包含指定的字母。
<标签名></标签名>这种叫双标签，标签有两个标记，一个代表开始，一个代表结束。标签名都是相同的，成对出现的。<标签名 />，这种叫单标签，不是成对出现的，结尾使用/来表示。<标签><br />，用来表示换行。- HTML标签名不区分大小写，但是我们推荐使用小写。
-
属性
loop="2"叫属性，用来修饰、控制标签。格式：
属性名="属性值"注意：
-
属性要写在标签里面。
-
写属性值的时候可以使用单引号、双引号包裹值，也可以不写引号。但是建议使用双引号。
-
<MARQUEE loop='2' width="50">等我有钱了，我就买辆公交车</MARQUEE>属性可以有多个，属性不区分先后。
-
背景属性
bgcolor="颜色值"-
直接的英文单词。
-
可以用6位的16进制的值来表示。
0-9a-f（不用记）将6位分成三组，份别代表红、绿、蓝，表示颜色的时候前面要加上
#号
-
-
-
HTML对于空格和回车的处理。
- HTML中一个空格和多个空格都会当做一个空格来处理。
- HTML中一个回车多个回车也会当做一个空格来处理。
-
实体
实体：用一些特殊的数字、字符来表示这些特殊的字符。
有些字符是系统预留的或打印不出来的，所以需要用实体来表示。
格式：
&字母;- 空格：
<，<>，>&，&"，"'，'
http://localhost:52330/1.html（经过网络了，在编辑器中的运行打开的）
file:///C:/xampp/htdocs/0323/01/1.html（没有经过网络，双击文件图标打开的） - 空格：
-
标签嵌套
<marquee><br /></marquee>双标签里面可以嵌套单标签，双标签里面也可以嵌套双标签。
-
总结：
<标签名 属性1="值1" 属性2="值2">要标记的内容</标签名><标签名 属性1="值1" 属性2="值2"/> -
注释符
<!-- 要注释的内容 -->使用注释符的情况：
- 说明代码意思的情况。
- 调试代码的时。
- 对于现在不使用的代码不要马上删除，先注释掉。整体功能都完成后再统一删除。
-
主体标签
-
告诉浏览器以什么方式来解释这个文档。
-
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> -
```
<!DOCTYPE html>用来告诉浏览器解释本文档中的内容的时候应该用HTML5的标准来进行解释。
__注意： __
- 必须放在第一行。
- 不区分大小写。
-
-
HTML文档的最外层要有一组
<html>标签，它是成对出现的，是网页文件的最外层标签。HTML文档中的所有的内容都应该存在于
<html>网页文档中的内容</html> -
<html>标签内部要有<head>和<body>标签。<head>标签：头标签，这里面的内容不会显示在浏览器中，这里面放置的是用来描述这个网页的一些内容。<body>标签：放置在网页中显示出来的内容都需要放在<body>中。
即使不写
<html>、<head>、<body>标签那浏览器在解释时也会自动加上。
-
