“前端三层”

前端三层

• 1. html结构 是直接被浏览器解析加载
• 1. CSS样式 是在html结构之上去装点网站
• 1. javascript 交互 动态效果/数据交互

     基础知识

• 1. 网页
     • 网页是构成网站的基本元素，通俗来讲，一个html文件就是一个网页
• 1. 网站
     • 是由很多个网页组成的，共同为一个目标服务的网页集合
• 1. 站群（流水线统一化管理）
     • 由很多网站组成的，为同一个公司服务。
     • 例如整个百度下所属的子公司都有自己的网站。例如：百度搜索/糯米/音乐/手机助手/百度金融等组成的就是一个站群。

HTTP（超文本传输协议）

• HyperText Transfer Protocol
• 在万维网上提供一种发布和接收HTML页面（网页）的方法。
• eg：http://www.baidu.com

404服务器无响应

步骤:

• 1. 输入网址，建立链接，建立客户端和服务端的连接。
• 1. 发送请求信息：客户端发送一个请求给服务器
• 1. 发送相应信息：服务器找到请求后，给予相应的响应信息
• 1. 关闭连接：客户端接收服务器所返回的信息通过浏览器显示在用户的显示屏上，然后客户机与服务器断开连接

服务器

• 服务器，是提供计算服务的设备。由于服务器需要响应服务请求，并进行处理，因此一般来说服务器应具备承担服务并且保障服务的能力。

• 在网络环境下，根据服务器提供的服务类型不同，分为文件服务器，数据库服务器，应用程序服务器，WEB服务器等。

  • 防篡改：WEB端服务器一旦受到攻击，在0.0n秒做出反应，将内网服务器中的内容，马上覆盖在WEB服务器上。
  • 负载均衡：平均WEB服务器压力，将用户访问进行分流。
  • vpn：用来翻墙，有指定账号就可以通过这个产品进行内网访问。

浏览器

• 浏览器是指可以显示网页服务器或者文件系统的HTML文件（标准通用标记语言的一个应用）内容，并让用户与这些文件交互的一种软件。

• html，css，js都是运行在这个软件中，浏览器是一个工厂，html/css/js是工人和原料。

• IE6–>IE7（很快淘汰）–>IE8(时间较长，稳定性好)–>IE9(半年到一年)–>IE10–>IE11–>IE11–>IE(Edge)

• 最好用的浏览器–>谷歌

网页的基本组成

• HTML:是网页的骨架,支撑起血肉(文字,图片,音视频等)
• CSS:表皮和衣服、化妆品
• javascript：动态和交互

HTML（超文本标记语言）

• 网页本身就是一种文本文件（除了文字再无其他），只有通过特定的标记描述，那些普通文本才能在浏览器中正常显示。
• 在页面中如果遇到图片、音视频的时候，如何用文本描述，需要用超文本进行引入才可以正常显示。

HTML文件的特点：

• 浏览器根据标记来解析和描述内容（从html的第一行开始向下），如果遇到错误，浏览器不会指出也不会报错，会跳过此处继续加载，编辑人员需要根据显示效果去分析哪里出错误了——html不会报错

HTML的兼容问题：

• 因为浏览器是由不同厂商生产的，所以对html的解析有分歧，产生了页面效果显示不一致的情况，我们将这个问题叫做兼容问题。

超文本（标签）

• 标签语法：

  • 由成对的尖括号和关键字组成，叫做标签。

  • 关键字（标签名）：是已经规范过的，不是自己随便制造的。

  • 例如：<div> , </h2> , <img/>

标签属性

• 属性提供了这个元素的更多信息，语法：由属性名和属性值组成（键值对 key=”value”）

  <span style="font-family:宋体;" title="标题">
  span是标签名
  style是标签属性名
  "font-family:宋体;标签属性值

• 一个标签可以由多个标签属性，每一个属性之间用空格隔开

标签的分类:

• 开始标签 <div>
• 结束标签 </div>
• 自闭合标签(空标签) <br/>

HTML元素

• 可以将元素理解成一个容器，容器中放置的就是

• 由标签和内容组成的，叫做元素。

<div>此处是内容</div>

元素分类

• 由开始标签和结束标签组成的元素，可以进行嵌套（一个元素包着另一个元素），元素中可以添加内容，只有一个空标签，只能进行功能的添加，例如img元素

• 标签和元素是用来标记和描述内容的，所以这些标签和元素用户是看不到的，用户只能看到这个元素的内容。