- 前端三层
- HTML结构层
- css样式层
- JavaScript行为层
- 其他多媒体内容(图片,音频等等)
互联网运行过程
客 --http请求--> 服
户 http协议 务
端 <--http响应-- 器
- 服务器server,一种特殊的计算器,包括处理器、硬盘、内存、系统总线等,但是由于需要提供更可靠的服务,因此在处理能力、稳定性、可靠性、安全性等方面要求较高。
- 作用:对于WEB来讲,用于存储开发人员上传的网页数据,且需要响应服务请求,并进行处理。
- 要求:对于网站服务器来说,为了让用户随时进行访问,必须24小时不间断工作
- 简单高效、安全可靠、处理能力可弹性伸缩的计算服务。其管理方式比物理服务器更简单高效。不用提前购买,即可徐速创建或释放任意多台云服务器。
- 用户端,普通用户使用的终端,客户端有多种形式,比如最常用的是浏览器、app等,而web开发最主要的客户端形式还是浏览器。
- 用于发送HTTP请求到服务器,接收服务器发回的HTTP响应,渲染HTML网页
主流浏览器: 内核(渲染引擎): 说明:
微软的IE和Microsoft Edge ---Trident IE内核
Mozilla的Firefox ---Gecko Firefox内核
苹果的Safari ---Webkit
Google的chrome ---Webkit-->Blink 统称为chrome内核
Opera的Opera ---Presto-->Webkit-->Blink
- 发送http请求
- 接受服务器发回的http响应
- 将接收的html进行解析并显示
是客户端浏览器或其他程序与web服务器之间的应用层通信协议
- http请求
- request,浏览器根据网址向对应的服务器发送请求
- 发起请求的方法:在浏览器地址栏中输入网址,或者点击网址链接
- html页面解析过程中,会发出多个http请求,包含网页的图片、视频、音频等文件请求。
- http响应
- response,服务器根据请求响应一个HTML文件,将HTML传输给客户端,在浏览器中进行HTML网页的渲染。
- 超文本标记语言,用来制作网页的一种标记语言;是一种纯文本格式的文件,但在网页中可以呈现包含文字以外的内容效果。
- 功能:利用标记给普通的文本添加语义、描述超文本内容,搭建网页的基本结构。
- 方便代码的阅读和后期的维护
- 便于浏览器或是网络爬虫更好的解析网站内容
- 使用语义化标签有利于SEO搜索引擎优化,提高网站的搜索排名
HTML规范版本:HTML1.0---html5
- 标签必须写在一堆尖括号<>内部
- 标签分为单标签和双标签,双标签必须成对出现
- 双标签包含开始标签和及结束标签,结束标签必须书写关闭符合/,单标签也需要进行自封闭书写。
根据标签内部可以存放的元素不同,可以将双标签划分为:
容器级:标签内部可以存放任意内容,包含容器级标签;
文本级:标签内部只能存放文字或类似文字的内容,如:图片,表单元素。
<html>
标签<html>
标签的内部<head>
标签<title>、<meta>、<base>、<style>、<script>、<link>
,内部用于对网页的设置<title>
内部的文字,其他标签都不显示在浏览器上。<title>
标签<body>
标签
- xml:可扩展标记语言,使用在传输过程中的规范,被设计用来传输和存储数据,是html的补充。
- xmlns:全称叫做XML NameSpace,NameSpace叫做命名空间,浏览器会将此命名空间用于该属性所在元素内的所有内容
<html>
元素的命名空间规定了在不同用户的浏览器中标签语义遵循的统一标准,避免出现标签名冲突,- 这个标准使用的是一个固定网址https://www.w3.org/1999/xhtml中的规范
语言- xml:lang="en"和lang="en" 表示所有的标签元素内容的语言都是英语,对搜索引擎和浏览器都是有帮助的
- lang="zh-cn" 表示中文(中国)
<head>
标签内部的<meta>
标签通过http-equiv属性定义了当前网页所使用的字符编码- char:character,字符。set:集合
- XHTML1.0版本
<meta http-equiv=“Content-Type” content=“text/html;charset=UTF-8”>
- 字符集常见问题:
若没有网页加载速度要求,或者制作的是外文网站,建议使用utf-8(包含世界所有国家需要的字符)
若有使用大量中文汉字,且要求网页加载速度快的,建议使用gbk(国标码)
注意!meta标签声明的字库,必须和编辑器软件默认编译字库相同,否则会出现两个字库不匹配,浏览器加载时出现乱码
原文:https://www.cnblogs.com/dreamtown/p/13861600.html