HTTP协议

四大特性

基于请求端响应

客户端发送请求，服务端才响应，服务端不会主动给客户端发送响应。

基于TCP/IP作用于应用层之上的协议

此协议属于应用层

无状态

服务端不会保存客户端的状态

无连接/短连接

无法保持长链接

数据格式

请求格式

请求首行（请求方式（有很多种）协议版本）

请求头（大量K:V键值对）

换行（必须要有）

请求体

响应格式

响应首行（请求方式（有很多种）协议版本）

响应头（大量K:V键值对）

换行（必须要有）

响应体

响应状态码

1xx 代表服务器已经收到了客户端的请求并且正在处理，客户端可以继续发送或者等待

2xx 如:200 表示请求成功，服务端发送了对请求的响应

3xx

如302（临时重定向，将访问的页面跳转到别的页面后再跳转回来）

如304（永久重定向，将访问的页面跳转到别的页面后不再跳转回原页面）

4xx

如403 无权限访问，如被防火墙拦截了

如404 访问的资源不存在

5xx

服务器内部的错误，与客户端无关

HTML基本语法结构

1. 注释语法(支持换行)

		<!--我是注释语法-->

2. 文档结构

        <html lang="en">

    <head>

        <meta charset="UTF-8">

        <title>Hello World</title>

    </head>

    <body>

		<!--我是文档体内容-->

    </body>

    </html>

3. 标签分类

	单标签（自闭和标签）（意思是自己闭合，内容写到标签内部）

		<img/>

	双标签

		<h1>

            内容被两个标签包起来

        </h1>

head内常见标签

1. title 网页的小标题，也就是浏览器显示“新建标签页”的那个地方

2. meta 定义网页源信息，如

    <head>

        <meta charset="UTF-8">

        <meta name="keywords" content="查询关键字">		# 百度的时候搜索的关键字

        <meta name="description" content="网页简介">	 # 百度搜索的结果里面每个网页都有的小介绍

        <title>Hello World</title>

    </head>

3. style内部支持编写css代码

	<style>

            h1 {

                color: greenyellow;

            }

    </style>

4. link引入外部css文件

    <link rel="stylesheet" href="mycss.css">

5. script支持内部编写js代码也可以引入外部js文件

    <script>

        prompt('加油，努力，为未来奋斗')		# 网页弹窗

    </script>

body内基本标签

1. 标题系列标签

	<h1>标题</h1>

	标题为 h1~h6

2. 段落标签

	<p>我是段落第一行</p>

    <p>我是段落行二行</p>

	多行段落使用多个p

3. 其他标签

	<p><u>我是u标签</u></p>		# 下划线

    <p><i>我是i标签</i></p>		# 斜体

    <p><s>我是s标签</s></p>		# 删除线

    <p><b>我是b标签</b></p>		# 加粗

    <p><b><s><i><u>我是多标签合一</u></i></s></b></p>

4. 换行与分割线

	<br>   换行，可以在输入的结尾添加

	<hr>   分割线

常见符号

&nbsp;	空格

&gt;	大于号

&lt;	小于号

&amp;	&符号

&yen;	¥符号

&copy;	符号

&reg;	符号

body内布局标签

div

	块级标签

span

	行内标签

body内布局标签

a标签

	href属性功能

		1. 填写网址，具备跳转功能

            <a href="https://www.baidu.com/">baidu</a>

		2. 填写其他标签的id值，具备锚点功能

	target属性功能

		1. _self为在页面跳转/_blank为创建新的页面并跳转

			<a href="https://www.baidu.com/" target="_self">baidu</a>

img标签  图片标签

	src

		1. 填写图片地址

			<img src="https://img2.baidu.com/it/u=1463809150,1385325066&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=706" alt="">

		2. 更多特性未来再学

    title

		鼠标悬浮在图片上自动展示的文本

			<img src="https://img2.baidu.com/it/u=1463809150,1385325066&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=706" alt="" title="新垣结衣">

	alt

		图片加载失败提示的信息

	width\height

		图片的尺寸，使用其中一个即可，因为是等经例缩放，两个都写的话会导致失真，单位是px

			<img src="https://img2.baidu.com/it/u=1463809150,1385325066&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=706" height="100px" title="新垣结衣">

列表标签

无序列表（没有1、2、3、4这种标注的列表）(一般页面上所有规则排列的横向或者竖向的数据基本上都用的无序列表)

    <ul>

        <li>手机</li>

        <li>衣物</li>

        <li>电子</li>

    </ul>

有序列表（type可以指定使用什么排序，支持的有1/a/A/i/I）

	<ol type="I">

        <li>手机</li>

        <li>衣物</li>

        <li>电子</li>

    </ol>

标题列表

    <dl>

        <dt>大标题</dt>

            <dd>小标题1</dd>

            <dd>小标题2</dd>

        <dt>大标题</dt>

            <dd>小标题1</dd>

            <dd>小标题2</dd>

    </dl>

表格标签

1. 基本框架

	<table border="1">				# 整个标签需要用table包起来,border代表边框，数字越大边框越粗

        <thead>			# 表头使用thead包起来

        	<tr>		# 一个tr代表表的一行

            	<th></th>	# 一个th代表表的一列，且使用th会有字体加粗的效果

            </tr>

        </thead>

        <tbody>			# 表的内容使用tbody包起来

        	<tr>		# 一个tr代表表的一行

                <td></td>	# 一个td代表表的一列，且td为普通字体

            </tr>

        </tbody>

	</table>

	正式代码如下：

    <table border="1">

        <thead>

            <tr>

                <th>编号</th>

                <th>姓名</th>

                <th>年龄</th>

            </tr>

        </thead>

        <tbody>

            <tr>

                <td>1</td>

                <td>jack</td>

                <td>18</td>

            </tr>

        </tbody>

    </table>

表单标签

什么是表单标签：就是获取用户的信息，上传给服务端

form标签

	action	控制数据的提交地址

	method	控制数据的提交方法

input标签

	type属性

		text			普通文本框

		password		输入会被加密

		date			年月日

		datetime-local	年月日时分秒

		email			邮箱（会判定输入是否合法）

		radio			单选

		checkbox		多选

		file			上传文件

		submit			提交按钮（不同浏览器默认显示的按钮内容不同，最好自已加value）

		reset			重置按钮（不同浏览器默认显示的按钮内容不同，最好自已加value）

		button			文本按钮（需要搭配value使用）(未来用的最多)

代码如下：

    <form action=""></form>

        <label for="id1">		# 绑定一个id号，绑定后用户点用户名三个字也可以输入密码

            <p>用户名<input type="text" id="id1"></p>	# text表示文本

        </label>

    <label for="id2">

        <p>密&nbsp;&nbsp;&nbsp;码<input type="password" id="id2"></p>	# password表示输入的东西变为密文

    </label>

        <p><input type="date"></p>		# date表示年月日

        <p><input type="datetime-local"></p>	#表示日月天时分秒

	 <label for="id3"><p>邮箱地址<input type="email" id="id3"></p> </label>	# 会自动较验邮箱输入是否合法

	    <p><input type="radio" name="gender">男</p>	# name相当于字典中的值,两个name相同时，这俩变为多选一

        <p><input type="radio" name="gender">女</p>

		<p><input type="checkbox" name="hobby">basketball</p>	# 多选多

        <p><input type="checkbox" name="hobby">football</p>

		<p><input type="file"></p>				# 上传文件

        <p><input type="file" multiple></p>		# 加上multiple上传多个文件

select标签	下拉框

	option标签	一个一个的选项

textarea标签	评论那种文本框

input标签应该有name属性

	name属性相当于字典的键 input标签获取到的用户数据相当于字典的值

	点击发送就会组织成字典的形式发送给服务端 这样才具有明确意义

HTTP协议初见的更多相关文章

http协议无状态中的 "状态" 到底指的是什么？！
引子: 最近在好好了解http,发现对介绍http的第一句话[http协议是无状态的,无连接的]就无法理解了:无状态的[状态]到底指的是什么?! 找了很多资料不仅没有发现有一针见血正面回答这个问题的, ...
http无状态协议，cookie和session详解（一）
1.HTTP无状态协议首先看百度百科给出的定义: HTTP无状态协议,是指协议对于事务处理没有记忆能力.缺少状态意味着如果后续处理需要前面的信息,则它必须重传, 这样导致可能每次连接传送的数据量增大 ...
Flume初见与实践
Photo by Janke Laskowski on Unsplash 参考书籍:<Flume构建高可用.可扩展的海量日志采集系统> --Hari Shreedharan 著以下简称& ...
[前端、HTTP协议、HTML标签]
[前端.HTTP协议.HTML标签] 什么是前端 """ 任何与用户直接打交道的操作界面都可以称之为前端比如:电脑界面手机界面平板界面什么是后端后端类似于幕后操 ...
01：HTTP协议
软件开发架构 cs 客户端服务端bs 浏览器服务端ps:bs本质也是cs 浏览器窗口输入网址回车发生了几件事 """ 1 浏览器朝服务端发送请求 2 服务端接受请 ...
进程池与线程池基本使用、协程理论与实操、IO模型、前端、BS架构、HTTP协议与HTML前戏
昨日内容回顾 GIL全局解释器锁 1.在python解释器中才有GIL的存在(只与解释器有关) 2.GIL本质上其实也是一把互斥锁(并发变串行牺牲效率保证安全) 3.GIL的存在是由于Cpyth ...
协程 & IO模型 & HTTP协议
今日内容进程池与线程池的基本使用协程理论与实操 IO模型前端简介内容详细一.进程池与线程池的基本使用 1.进程池与线程池的作用为了保证计算机硬件安全的前提下,提升程序的运行效率 2.回调机 ...
前端入门 HTTP协议 HTML简介 head内常见标签 body内常见标签特殊符号列表标签表格标签表单标签
目录前端和后端的概念前端前戏之B/S架构数据交互的协议 HTTP协议 1.四大特性 1. 基于请求响应 2. 基于TCP.IP作用与应用层之上的协议 3. 无状态 4. 无\短连接 2.数据格式 ...
11月30日内容总结——前端简介、http协议概念、html协议概念及基础知识和部分标签的讲解
目录一.前端与后端的概念什么是前端开发? 什么是后端? 学习前端的目的前端三剑客二.前端前戏三.HTTP协议 1.四大特性 2.报文格式 3.响应状态码四.HTML概览 1.HTML简介 ...
HTTP协议系列(1)
一.为什么学习Http协议首先明白我们为什么学习HTTP协议,也就是说明白HTTP协议的作用.HTTP协议是用于客户端与服务器之间的通讯.明白了HTTP协议的作用也就知道了为什么要学习H ...

随机推荐

mybatis批量更新的几种方式和性能对比
https://blog.csdn.net/csdnbeyoung/article/details/106258611
Verilog中端口的连接规则
摘自于(15条消息) Verilog中端口应该设置为wire形还是reg形_CLL_caicai的博客-CSDN博客, 以及(15条消息) Verilog端口连接规则_「已注销」的博客-CSDN博客_ ...
arduino问题记录
1.tx.rx只能写,不能读 2.Arduino中文社区
学习JavaScript第四周
创建闭包的四个条件: 1.要有函数嵌套,且里层函数要操作外层函数被保护的变量. 2.返回里层函数 3.里层定义的函数要被调用,哪怕是返回一个匿名函数也行. 4.用一个变量接住,方便后续的使用. 注意: ...
3-1 熟悉Hadoop及其操作
Hadoop最早起源于Nutch.Nutch的设计目标是构建一个大型的全网搜索引擎,包括网页抓取.索引.查询等功能,但随着抓取网页数量的增加,遇到了严重的可扩展性问题--如何解决数十亿网页的存储和索引 ...
实验一Linux系统与应用准备
实验一Linux系统与应用准备 |这个作业属于哪个课程|内容| | ---- | ---- | ---- | |这个作业属于哪个课程|2021春季Linux系统与应用 (南昌航空大学 - 信息工程学院 ...
renren-fast-vue人人开源前端项目搭建保姆级教程
1.从gitee上clone项目 git clone https://gitee.com/renrenio/renren-fast-vue.git 2.准备好python环境需要有Python2以上 ...
Java线上日志分析
1.查询关键字前后30行 cat 日志文件名.log | grep -30 '关键字' 例: cat mcs-all.log | grep -30 '2019-04-08 13:30:04,271' ...
Connect to D365 CE with multi-factor Authentication using C# sharp
Effective Feb 4, 2020 - Use of the WS-Trust (Web-Service Trust) authentication security protocol whi ...
raid随笔
1.raid 0 准备两个磁盘 [root@localhost ~]# lsblkNAME MAJ:MIN RM SIZE RO TYPE MOUNTPOINTsda 8:0 0 40G 0 disk ...

HTTP协议初见

HTTP协议

四大特性

数据格式

HTML基本语法结构

head内常见标签

body内基本标签

常见符号

body内布局标签

body内布局标签

列表标签

表格标签

表单标签

HTTP协议初见的更多相关文章

随机推荐

热门专题