-
-
- 前端的概念
- 前端的学习思路
- 软件开发架构
- 浏览器访问 址的流程
- HTTP协议
- 四大特性
- 请求数据格式
- 响应数据格式
- 响应状态码
- 请求方式
- url:统一资源定位符(即 址)
- 标签的分类1
- head内常用标签
- body内常用标签
- 基本标签
- 标签的分类2
- 特殊符
- 常用标签
- img标签
- a标签
- 标签具有的两个重要书写
- 列表标签
-
前端的概念
前端即 站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的 页。随着互联 技术的发展,HTML5,CSS3,前端框架的应用,跨平台响应式 页设计能够适应各种屏幕分辨率,合适的动效设计,给用户带来极高的用户体验。
前端的学习思路
HTML、CSS、JavaScript
这三个是前端开发中最基本也是最必须的三个技能。前端的开发中,在页面的布局时, HTML将元素进行定义,CSS对展示的元素进行定位,再通过JavaScript实现相应的效果和交互。虽然表面看起来很简单,但这里面需要掌握的东西绝对不会少。在进行开发前,需要对这些概念弄清楚、弄明白,这样在开发的过程中才会得心应手。
HTML
HTML: 页的骨架 没有任何的样式
指的是超文本标记语言 (Hyper Text Markup Language),这个也是我们 页最常用普通的语言了,经历了多个版本的发展,已经发展到5.0版了,得力于W3C建立的标准和规范,已普遍升级到了XHTML,XHTML 指可扩展超文本标签语言(EXtensible HyperText Markup Language), XHTML 于2000年的1月26日成为 W3C 标准,是更严格更纯净的 HTML 代码,XHTML 的目标是取代 HTML。XHTML 与 HTML 4.01 几乎是相同的,XHTML 是作为一种 XML 应用被重新定义的 HTML,是一个 W3C 标准。W3C 将 XHTML 定义为最新的HTML版本。所有新的浏览器都支持 XHTML。
CSS
CSS:给骨架添加各种样式 变得好看
级联样式表(Cascading Style Sheet)简称“CSS”,通常又称为“风格样式表(Style Sheet)”,它是用来进行 页风格设计的。比如,如果想让链接字未点击时是蓝色的,当鼠标移上去后字变成红色的且有下划线,这就是一种风格。通过设立样式表,可以统一地控制HTML中各标志的显示属性。级联样式表可以使人更能有效地控制 页外观。使用级联样式表,可以扩充精确指定 页元素位置,外观以及创建特殊效果的能力。
JavaScript
JS:控制 页的动态效果
是一种由Netscape的LiveScript发展而来的原型化继承的面向对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。当时服务端需要对数据进行验证,由于 络速度相当缓慢,只有28.8kbps,验证步骤浪费的时间太多。于是Netscape的浏览器Navigator加入了Javascript,提供了数据验证的基本功能。
还有不少封装好的框架比如:BOOTSTRAP、JQuery、Vue 只需按固定的语法调用即可
软件开发架构
cs 客户端-服务端
bs 浏览器-服务端
从本质上讲,bs也是cs
自然地,浏览器可以充当很多服务端的客户端比如 爱奇艺视频 搜狐视频…
浏览器访问 址的流程
浏览器朝服务端发送请求→服务端接受请求→ 服务端返回相应的响应(eg:返回 页)→浏览器接收响应 →根据特定的规则渲染页面展示给用户看
HTTP协议
原理:通过制定统一标准使得浏览器能够与我们构建地服务端交互,达到使用浏览器作为客户端的目的,从而扩大了我们客户端的潜在使用人数,因为每台电脑基本都有浏览器
超文本传输协议 用来规定服务端和浏览器之间的数据交互的格式…
超文本传输协议(Hyper Text Transfer Protocol,HTTP)是一个简单的请求-响应协议,它通常运行在TCP之上。它指定了客户端可能发送给服务器什么样的消息以及得到什么样的响应。请求和响应消息的头以ASCII形式给出;而消息内容则具有一个类似MIME的格式。这个简单模型是早期Web成功的有功之臣,因为它使开发和部署非常地直截了当。
四大特性
1.基于请求响应
2.基于TCP/IP作用于应用层之上的协议
3.无状态
不保存用户的信息
由于HTTP协议是无状态的 所以后续出现了一些专门用来记录用户状态的技术cookie、session、token…
4.无/短链接
请求来一次我响应一次 之后我们两个就没有任何链接和关系了
长链接:双方建立连接之后默认不断开 websocket(后面讲项目的时候会讲)
请求数据格式
请求头(一大堆k,v键值对)-head
请求体(并不是所有的请求方式都有get没有post有 存放的是post请求提交的敏感数据)
响应数据格式
响应头(一大堆k,v键值对)
响应体(返回给浏览器展示给用户看的数据)
响应状态码
200 – 请求成功
301 – 资源( 页等)被永久转移到其它URL
404 – 请求的资源( 页等)不存在
500 – 内部服务器错误
请求方式
GET:
GET通常用于获取服务端数据。
常见发起GET请求的方式有:URL 、src/href、表单(form)。
GET方式提交数据的格式:
格式:index.phpserName=jack&password=123 (注意:index.phpey=value&key=value。 userName=jack&password=123 叫做查询字符串)
参数名与参数值之间没有空格
参数值不需要使用单双引 包括
GET方式提交数据特点:
1、get方式在url后面拼接参数,只能以文本的形式传递参数。
2、传递的数据量小,4kb左右(不同浏览器会有差异)。
3、安全性低,会将信息显示在地址栏。
4、速度快,通常用于对安全性要求不高的请求。
POST请求:
POST就是发送、提交。可以向指定的资源提交要被处理的数据。
如果使用表单方式进行提交,表单的method必须设置为POST。
post方式提交的特点:
1、post提交数据相对于get的安全性高一些。(注意:抓包软件也会抓到post的内容,安全性要求高可以进行加密)
2、传递数据量大,请求对数据长度没有要求。
3、请求不会被缓存,也不会保留在浏览器的历史记录中。
4、用于密码等安全性要求高的场合,提交数据量较大的场合,如上传文件,发布文章等。
5、POST方式提交数据上限默认为8M(可以在PHP的配置文件post_max_size选项中修改)
url:统一资源定位符(即 址)
在WWW上,每一信息资源都有统一的且在 上唯一的地址,该地址就叫URL(Uniform Resource Locator,统一资源定位器),它是WWW的统一资源定位标志,就是指 络地址。
标签的分类1
head内常用标签
在书写HTML代码的时候 你只需要写标签名 然后tab就能自动补全
body内常用标签
你肉眼能够在浏览器上面看到的花里胡哨的页面。内部都是HTML代码
基本标签
标签的分类2
特殊符
常用标签
img标签
a标签
标签具有的两个重要书写
标签既可以有默认的书写也可以有自定义的书写
声明:本站部分文章及图片源自用户投稿,如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢!