HTML 前端学习(1)—— 初识HTML 浏览器输入网址回车后发生了几件事?
1. 浏览器朝服务端发送请求
2. 服务端接收请求(eg:请求百度首页)
3. 服务端返回相应的响应(eg:返回一个百度首页)
4. 浏览器接收响应,根据特定的规则渲染页面展示给用户看
如何做到浏览器能和多个客户端之间进行数据交互
1. 浏览器可以自动识别不同服务端做出不同的处理
2. 制定一个统一的标准,即 HTTP 协议
HTTP协议 超文本传输协议
1. 用来规定服务端和浏览器之间的数据交互格式
2. 该协议可以不遵循,但是你的服务端不能被浏览器正常访问,就自己写客户端,用户使用就下载你专门的 APP
四大特性
1. 基于请求响应2. 基于 TCP/IP 作用于应用层3. 无状态
不保存用户信息
eg:一个人来了一千次,你都记不住,当作是第一次见面
由于 HTML协议 是无状态的,所以后续出现了一些专门来记录用户状态的技术:session,cookie,token
4. 短/无链接接
请求来一次响应一次
长链接:双方建立链接之后默认不断开,如 webstorm
请求数据格式
请求首行(标识 HTTP 协议版本,当前请求方式 )
请求头(一大堆 K,V 键值对)
\r\n
请求体(并不是所有的请求方式都有。get没有post有,存放的是post请求提交的敏感数据)
响应数据格式
响应首行(标识 HTTP 协议版本,当前响应状态码)
响应头(一大堆K,V键值对)
\r\n
响应体(返回给浏览器展示给用户看的数据,及页面)
请求方式
Get 请求
从服务端(浏览器)获取数据
一般情况下不使用请求体存储数据,如果要存储数据一般使用URL后面直接加数据的方式
例如:url?username=aoteman&password=abc123
eg.输入网址获取对应的内容Post 请求
向服务端(浏览器提供数据)
eg.用户登录,输入用户名和密码,提交到服务端后端做身份校验
响应状态码
用一串简单的数字表达一段简单的状态或者描述性信息。
1xx:服务端已经成功接收到你的数据正在受理,你可以继续提交额外的信息2xx:服务端成功响应了你想要的数据(200 表示请求成功)3xx:重定向(当你在访问一个需要登陆才能看的页面,你会发现自动跳转到登陆页面)4xx:请求错误
404:请求资源不存在
403:当前请求不合法或者不符合访问资源的条件5xx:服务器端出现问题,比如服务器崩溃
HTML 【HTML|HTML 前端学习(1)—— 初识HTML】超文本标记语言
注释
注释是代码之母
1.
2.
3. 由于HTML代码非常的杂乱无章并且很多,所以我们习惯性的用注释来划定区域方便后续的查找导航条所有 HTML 代码
文档结构
写HTML文件配置内容,不是给用户展示的,即用户不需要看懂
浏览器渲染展示给用户看的部分
标签分类 单标签和双标签
单标签,如:
文章图片
双标签,如:
块级标签和行内标签
常见的块级标签
独占一行
div标签,p标签,h1~h6
1. 块级标签可以修改长宽,行内标签不可以,修改了也不会变化
2. 块级标签内部既可以嵌套块级标签也可以嵌套行内标签
ps: p 标签只能嵌套行内标签,但如果嵌套了行内标签也没有问题,因为在运行的时候浏览器会自动解套常见的行内标签
自身文本多大就占多大位置
span标签 i u s b
行内标签可以嵌套行内标签
head内常用标签
Title - 锐客网 定义页面名称>CSS层叠样式href 调用本地的 CSS 文件进行渲染>书写 js 命令 或是 调用 js 文件 当你在用浏览器搜索时,只要输入了 keywords 后面指定的关键词那么该网页就有可能被百度搜索出来展示给用户 网页的描述信息
body内常用标签
超链接
href 可以输入网址也可以输入该HTML文件中的标签 id ,实现跳转
如:跳转
123
target 默认是 _blank 表示新打开一个网页跳转页面
_self表示在原有网页的基础上跳转页面
文章图片
图片标签
src 可以输入本地图片路径
也可以输入 url (注意这里 url 既可以是图片的url 也可以是网址的 url)
alt 是图片加载不出来展示给用户的描述性信息
title 鼠标悬浮到图片上之后,自动展示的提示信息
height="800px"
width=""
高度和宽度只修改一个参数时,另一个参数会等比例缩放
段落标签,展示时自动换行标题标签,从 h1~h6加粗
斜体
下划线
>删除线
HTML 中特殊符号
空格
>
大于号
<
小于号
&
&符号
¥
羊角符?
©
版权?
®
商标?
标签的两个重要属性
id 值
类似于身份证,在一个 HTML 文档中,不能有相同的 id 值
class 值
该值有点类似于面向对象里面的继承,一个标签可以继承多个 class 值
列表标签
- 1
- 2
- 3
推荐阅读
- html|2小时入门html5 新手教程
- HTML|1小时学会HTML5基础
- C语言程序练习|交换最小值和最大值
- 学习|Git入门与实践
- 前后端分离|springboot+vue 架构 (二)
- 炼气化神——信源编码之定乾坤
- 数字信号处理之期中斩神篇(四重 斩仙)
- 学习|使用IOS快捷指令打开任意支付宝小程序
- 地址栏里输入一个网址敲下回车会发生什么()