当前位置: 首页 > news >正文

【网站架构部署与优化】web服务与http协议

文章目录

  • HTML
    • HTML 概述
    • HTML 语法规则
    • HTML 文件结构
    • 头标签中常用标签
    • 静态网页与动态网页
      • 1. 静态网页
      • 2. 动态网页
      • 3. 动态网页语言
  • HTTP协议
    • 概述
      • 主要的HTTP版本包括:
      • HTTP方法
        • GET与POST方法的比较
    • HTTP状态码分类及常见状态码
      • HTTP常见状态码
    • HTTP 请求流程分析
      • 1. 请求报文
      • 2. 响应报文
      • 流程总结

HTML

HTML 概述

HTML(HyperText Markup Language)是一种用于创建网页和网页应用程序的标准标记语言。它不是一种编程语言,而是一种标记语言,通过不同的标签(tags)来告诉浏览器如何显示内容。

HTML 语法规则

  • 标签:HTML标签使用尖括号<>包围,如<p>。大多数标签成对出现,即有一个开始标签和一个结束标签(结束标签前会加上斜杠/),但也有自闭合标签(如<img /><br />等)。
  • 属性:标签可以包含属性,属性提供了有关HTML元素的额外信息。属性总是以名称/值对的形式出现,如<a href="https://www.example.com">链接</a>

HTML 文件结构

一个基本的HTML文件结构包括<html><head><body>三个主要部分:

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>页面标题</title><!-- 其他head标签,如<link>、<meta>、<script>、<style>等 --></head><body><!-- 网页的可见内容 --><p>这是一个段落。</p><!-- 其他body标签</body>
</html>

也就是:

<html><head>网页的内容描述信息</head><body>网页显示的内容</body>
</html>

头标签中常用标签

  • <title>:定义了文档的标题,显示在浏览器的标题栏或页面的标签上。
  • <meta>:用于提供有关HTML文档的元数据,如字符集定义(<meta charset="UTF-8">)、页面描述、关键词、作者等。
  • <link>:定义文档与外部资源的关系,常用于链接CSS样式表。
  • <script>:用于定义客户端脚本,如JavaScript。
  • <style>:定义内部样式表,用于直接在当前页面中编写CSS样式。<td>:分别用于定义表格、表格中的行和单元格。
  • <img>:用于嵌入图像。
  • <a>:定义超链接,可以链接到其他网页、文件、邮箱地址、位置等。
  • <p>:定义段落。
  • <br>:插入一个简单的换行符。
  • 注意<font><h1><h6>的用法有所不同。<font>标签已不推荐使用(HTML5中已废弃),用于定义文本的字体、大小和颜色等样式。而<h1><h6>标签用于定义六级标题,<h1>是最高级别的标题。

静态网页与动态网页

1. 静态网页

  • 定义:在网站设计中,纯粹由HTML(HyperText Markup Language)编写的网页被称为“静态网页”。这些网页的文件扩展名通常为.htm.html
  • 特点
    • 静态网页的内容在HTML代码生成后基本不会发生变化,除非手动修改HTML代码。
    • 静态网页可以包含视觉上的“动态效果”,如GIF动画、FLASH动画、滚动字幕等,但这些效果并不改变页面的实际内容或结构。
    • 静态网页是网站建设的基础,早期的网站大多由静态网页构成。

2. 动态网页

  • 定义:动态网页是与静态网页相对的一种网页编程技术。动态网页的内容可以根据时间、环境或数据库操作的结果而发生变化,即使页面代码本身没有改变。
  • 特点
    • 动态网页的URL后缀通常不是静态网页的常见格式(如.htm.html.shtml.xml),而是.aspx.asp.jsp.php.perl.cgi等。
    • 动态网页的网址中常包含“?”符号,作为查询字符串的开始,用于传递参数。
    • 动态网页结合了HTML语法规范与Java、PHP、C#等高级程序设计语言、数据库编程等多种技术,以实现高效、动态和交互式的网站内容和风格管理。

3. 动态网页语言

  • 早期技术:通用网关接口(CGI,Common Gateway Interface)是早期的动态网页技术,尽管功能强大,但编程复杂、效率低下,逐渐被新技术取代。

  • 当前常用语言

    • PHP:Hypertext Preprocessor(超文本预处理器),语法借鉴了C、Java、PERL等语言,易于学习,是Internet上广泛使用的脚本语言。
    • JSP:Java Server Pages(Java服务器页面),基于Java Servlet及Java体系的Web开发技术,由Sun Microsystems(现为Oracle所有)推出。
    • Python:一种面向对象、跨平台的动态类型计算机程序设计语言,初用于自动化脚本编写,现广泛用于大型项目开发。
    • Ruby:一种简单快捷的面向对象脚本语言,由日本人松本行弘开发,灵感来源于多种编程语言,如Perl、Smalltalk、Eiffel、Ada和Lisp。

HTTP协议

概述

HTTP协议是一种基于请求与响应模型的应用层协议。在这种模型中,客户端首先向服务器发起请求,该请求中包含了请求的方法、目标URL、所使用的HTTP协议版本,以及一些请求修饰符、客户端信息和消息体(类似于MIME结构)。随后,服务器会返回一个响应,该响应以状态行开始,其中包含了消息协议的版本、表示成功或错误的编码,以及服务器信息、实体元信息和可能的实体内容。
随着时间的推移,HTTP已经发展出了多个版本,且大部分版本都保持了向下兼容性。

主要的HTTP版本包括:

http1.0:只支持短连接(在一个TCP连接中只能完成一次http请求和响应过程)
http1.1:支持长连接(连接保持、持久连接)和管道机制,即支持在一个TCP连接中可完成多次http请求和响应,且要求按照顺序一一对应
http2.0:支持长连接和多路复用,即支持在一个TCP连接中可完成多次http请求和响应,且不用按照顺序一一对应;还支持网页头部压缩和服务端主动推送;使用二进制格式代替文本格式
http3.0:基于UDP协议实现。具有更高的传输效率

版本描述
HTTP/0.9已过时,仅支持GET请求,不指定版本号,不支持请求头
HTTP/1.0首次指定版本号,广泛使用于代理服务器
HTTP/1.1引入持久连接和管道机制,提高传输效率
HTTP/2.0实现完全多路复用、头部压缩和服务端推送等功能
HTTP/3.0基于UDP协议实现。具有更高的传输效率

HTTP方法

HTTP定义了一系列请求方法(也称为HTTP动词),用于指示服务器应执行何种操作。这些方法包括GET、POST、PUT、DELETE等,每种方法都有其特定的用途和语义。

方法描述
GET获取服务器资源,类似于数据库的SELECT操作
PUT向服务器提交数据以修改资源,类似于数据库的UPDATE操作
DELETE删除服务器上的资源,类似于数据库的DELETE操作
POST发送包含用户提交数据的请求,类似于数据库的INSERT操作
HEAD请求页面的首部,获取资源的元信息
CONNECT建立特殊的连接隧道
OPTIONS列出可对资源实行的方法
TRACE追踪请求-响应的传输路径
  1. GET请求会向数据库发索取数据的请求,从而来获取信息,该请求就像数据库的select操作一样,只是用来查询一下数据,不会修改、增加数据,不会影响资源的内容,即该请求不会产生副作用。无论进行多少次操作,结果都是一样的。
  2. 与GET不同的是,PUT请求是向服务器端发送数据的,从而改变信息,该请求就像数据库的update操作一样,用来修改数据的内容,但是不会增加数据的种类等,也就是说无论进行多少次PUT操作,其结果并没有不同。
  3. POST请求同PUT请求类似,都是向服务器端发送数据的,但是该请求会将数据携带在body当中,通常表示的是“create”的含义,就像数据库的insert操作一样,会创建新的内容。几乎目前所有的提交操作都是用POST请求的。
  4. DELETE请求顾名思义,就是用来删除某一个资源的,该请求就像数据库的delete操作
GET与POST方法的比较
  • GET方法

    • 用于从服务器获取数据。
    • 请求可以被缓存。
    • 请求会保存在浏览器历史记录中。
    • 请求长度有限制。
    • 查询字符串会显示在URL中,可能存在安全风险。
  • POST方法

    • 用于向服务器提交数据进行处理。
    • 请求不能被缓存。
    • 请求不会保存在浏览器历史记录中。
    • 请求长度无限制。
    • 查询字符串不会显示在URL中,相对更安全。
特性GET方法POST方法
缓存能被缓存不能被缓存
浏览器历史记录会保存不会保存
长度限制有长度限制无长度限制
数据获取/提交主要用于获取数据主要用于提交数据
安全性查询字符串显示在URL中,不安全查询字符串不会显示在URL中,相对安全

以下是根据您提供的信息整理成的表格:

HTTP状态码分类及常见状态码

HTTP 状态码(HTTP Status Code)是用以表示网页服务器 HTTP 响应状态的 3 位数字代码,当浏览器请求某一 URL 时, 服务器根据处理情况返回相应的处理状态。
正常的响应状态码 1XX(提示信息) 2XX(正常处理) 3XX(重定向)
异常的响应状态码 4XX(客户端请求错误) 5XX(服务器请求错误)

状态码首位已定义范围分类
1xx100-199提示信息,表示目前是协议处理的中间状态,还需要后续的操作
2xx200-299成功,报文已经收到并被正确处理
3xx300-399重定向,资源位置发生变动,需要客户端重新发送请求
4xx400-499客户端错误,请求报文有误,服务器无法处理
5xx500-599服务器错误,服务器在处理请求时内部发生了错误

HTTP常见状态码

状态码功能描述
200一切正常
301永久重定向
302临时重定向
401用户名或密码错误
403禁止访问(客户端IP地址被拒绝)
404请求的文件不存在
414请求URI头部过长
500服务器内部错误
502无效网关
503当前服务不可用
504网关请求超时

HTTP 请求流程分析

当用户在浏览器中输入一个URL并按下回车键时,浏览器会发起一个HTTP请求到服务器。这个请求包含了请求报文,而服务器在接收到请求后会返回一个响应报文。整个过程可以细分为以下几个步骤:

1. 请求报文

请求报文由以下几个部分组成:

  • 请求行:包含请求方法(如GET、POST)、请求的URL以及HTTP协议版本(如HTTP/1.1)。
  • 请求头:键值对类型的元数据信息,由多个“名/值”对组成,用于传递附加信息给服务器。常见的请求头包括:
    • Host:请求的目标主机名和端口号。
    • User-Agent:发起请求的应用程序名称和版本,如浏览器类型和版本。
    • Connection:指定与连接相关的属性,如是否保持连接(Keep-Alive)。
    • Accept-Charset:客户端可以接受的字符编码集。
    • Accept-Encoding:客户端可以接受的内容编码格式,如gzip、deflate。
    • Accept-Language:客户端优先使用的语言。
  • 空行:请求头部和请求体之间的分隔符,表明请求头部的结束。
  • 请求体:可选部分,包含发送给服务器的数据。GET请求通常不包含请求体,数据通过URL传递;POST请求的数据则包含在请求体中。

2. 响应报文

响应报文也由几个部分组成:

  • 状态行:包含HTTP协议版本、状态码以及状态码描述。状态码用于表示请求的处理结果,如200表示成功,404表示未找到资源。
  • 响应头:键值对类型的元数据信息,与请求头类似,用于传递附加信息给客户端。常见的响应头包括:
    • Server:服务器软件的名称和版本。
    • Content-Type:响应体的媒体类型,如text/html表示HTML文档。
    • Content-Length:响应体的长度(字节数)。
    • Content-Charset:响应体使用的字符编码。
    • Content-Encoding:响应体使用的数据压缩格式。
    • Content-Language:响应体使用的自然语言。
  • 空行:响应头部和响应体之间的分隔符,表明响应头部的结束。
  • 响应体:服务器返回给客户端的实际数据,如HTML文档、图片等。

流程总结

  1. 用户输入URL:用户在浏览器地址栏输入URL并按下回车键。
  2. 浏览器解析URL:浏览器解析URL,确定请求的资源位置(IP地址和端口)和路径。
  3. 构建请求报文:浏览器根据请求的资源和方法(如GET、POST)构建请求报文,包括请求行、请求头、请求体(如果有)。
  4. 发送请求:浏览器将请求报文发送给服务器。
  5. 服务器处理请求:服务器接收请求报文,解析请求,根据请求执行相应的操作(如查询数据库、生成动态页面)。
  6. 构建响应报文:服务器根据处理结果构建响应报文,包括状态行、响应头、响应体。
  7. 发送响应:服务器将响应报文发送给浏览器。
  8. 浏览器解析响应:浏览器接收响应报文,解析响应头和响应体,渲染页面或执行其他操作。

相关文章:

【网站架构部署与优化】web服务与http协议

文章目录 HTMLHTML 概述HTML 语法规则HTML 文件结构头标签中常用标签静态网页与动态网页1. 静态网页2. 动态网页3. 动态网页语言 HTTP协议概述主要的HTTP版本包括&#xff1a;HTTP方法GET与POST方法的比较 HTTP状态码分类及常见状态码HTTP常见状态码 HTTP 请求流程分析1. 请求报…...

【字符函数】strcpy函数(字符串复制函数)+strcat函数(字符串追加)+strcmp函数(字符串比较)【笔记】

1.复制函数--------------strcpy函数 函数使用 char*strcpy&#xff08;char* destination, const char* source&#xff09; strcpy函数用于拷贝字符串&#xff0c;即将一个字符串中的内容拷贝到另一个字符串中&#xff08;会覆盖原字符串内容&#xff09;。它的参数是两个指…...

codetop字符串刷题,刷穿地心!!不再畏惧!!暴打面试官!!

主要供自己回顾与复习&#xff0c;题源codetop标签字符串近半年&#xff0c;会不断更新 1.有效的括号字符串2.括号生成3.最长单词4.字符串转换整数(atoi)5.整数转罗马数字6.罗马数字转整数7.比较版本号8.最长公共前缀9.面试题17.15.最长单词10.验证IP地址11.面试题01.06.字符串…...

快速体验Linux发行版:DistroSea详解与操作指南

DistroSea 是一个功能强大的在线平台&#xff0c;允许用户在无需下载或安装的情况下&#xff0c;通过浏览器直接测试多种Linux和BSD发行版。该平台非常适合Linux爱好者、系统管理员和开发者&#xff0c;提供一个简便的方式来体验各种操作系统而无需影响本地设备。 为什么选择D…...

Java设计模式—面向对象设计原则(二) --------> 里氏代换原则 LSP (完整详解,附有代码+案列)

文章目录 里氏代换原则3.2.1 概述3.2.2 改进上述代码 里氏代换原则 里氏代换原则&#xff1a;Liskov Substitution Principle&#xff0c;LSP 3.2.1 概述 里氏代换原则是面向对象设计的基本原则之一。 里氏代换原则&#xff1a;任何基类可以出现的地方&#xff0c;子类一定…...

使用ShardingSphere实现MySql的分库分表

目录 一 什么是ShardingSphere分库分表 二 代码实现 1.导入相关依赖 2.配置相关参数 3.创建学生类以及mapper接口 4.实现 StandardShardingAlgorithm接口自定义分片算法 唐洋洋我知道你在看!!!嘿嘿 一 什么是ShardingSphere分库分表 我们平时在设计数据库的时候&#xf…...

为什么 Feign 要用 HTTP 而不是 RPC?

一、引言 在现代微服务架构中&#xff0c;服务之间的通信是至关重要的环节。Feign 是一种常用的声明式 HTTP 客户端工具&#xff0c;它简化了服务间的调用过程。然而&#xff0c;在服务通信的领域中&#xff0c;除了基于 HTTP 的方式&#xff0c;还有 RPC&#xff08;Remote Pr…...

OJ在线评测系统 前端开发设计优化通用菜单组件二 调试用户自动登录

通用的菜单组件开发二 接下来要完善 权限功能 就是只有登录后才能进入题目查看界面 用户只能看到我们有权限的菜单 我们要在路由文件里面去操作 原理是控制路由设置隐藏 只要用户没有权限 就过滤掉隐藏 全局权限管理 实现想清楚有那些权限 /*** 权限定义*/ const ACCES…...

mongodb 安装教程

mongodb 安装教程&#xff1a; https://blog.51cto.com/u_13646338/5449015 wget https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-rhel70-5.0.9.tgz tar -zxvf mongodb-linux-x86_64-rhel70-5.0.9.tgz -C /opt/module/ [roothadoop102 module]# mv mongodb-linux-…...

切换淘宝最新镜像源npm

要切换淘宝的npm镜像源&#xff0c;可以按照以下步骤进行&#xff1a; 1. 打开命令行工具&#xff08;如Terminal、CMD等&#xff09;。 2. 输入以下命令来查看当前的npm镜像源&#xff1a; npm config get registry 3. 如果当前的镜像源不是淘宝镜像源&#xff…...

SpringAI-基于java大模型的胡言乱语

最近看了一点相关的springAI知识&#xff0c;做个小总结 胡言乱语开始 1.不同的ai调用api一般单独汇总成一个依赖&#xff0c;比如说调用openai的api的依赖是spring-ai-openai-spring-boot-starter。 2.最常用的展示方式是流式对话&#xff0c;AI的数据是一个字一个字生成的…...

python提问及解析

在看答案之前&#xff0c;可以先试试自己做哦&#xff01; 1.图书馆借书还书系统 问题描述 问题&#xff1a;设计一个Python程序&#xff0c;该程序模拟一个大型图书馆的图书管理系统。图书馆拥有成千上万的书籍&#xff0c;每本书都有一个唯一的ISBN号、书名、作者、出版年份…...

从Apple Intelligence到IoT Intelligence,端侧生成式AI时代加速到来

9月10日凌晨1点&#xff0c;苹果新品发布会如期举行&#xff0c;全新iPhone16系列成为苹果生态中真正意义上的第一款原生AI手机&#xff0c;在第二代3nm工艺A18和A18 Pro芯片的加持下&#xff0c;iPhone16系列能够容纳并快速运行以Apple Intelligence为中心的生成式AI功能在手机…...

智能AC管理系统HTTPD-AC 1.0服务存在未授权访问漏洞

@[toc] 智能AC管理系统HTTPD-AC 1.0服务存在未授权访问漏洞 免责声明:请勿利用文章内的相关技术从事非法测试,由于传播、利用此文所提供的信息或者工具而造成的任何直接或者间接的后果及损失,均由使用者本人负责,所产生的一切不良后果与文章作者无关。该文章仅供学习用途…...

Sidewalk介绍

目录 1 前言2 简介2.1 注意事项 3 结束语 1 前言 Sidewalk是Amazon出的一个针对IoT物联网的协议&#xff0c;类似于LoRaWAN协议&#xff0c;针对小而美的低功耗设备。Amazon Sidewalk支持低带宽和远程连接&#xff0c;使用BLE进行短距离通信&#xff0c;使用900MHz的频率的LoR…...

Java数据结构 (泛型第二节) 泛型擦除机制/泛型的限制/上界下界

书接上回&#xff1a;Java数据结构 (泛型第一节) 为什么要有泛型/泛型语法/泛型方法-CSDN博客 访问作者Github: https://github.com/Joeysoda/Github_java/blob/main/20240908%E6%B3%9B%E5%9E%8B/src/%E6%B3%9B%E5%9E%8B.java 目录 1. 为什么要有擦除机制&#xff1f; 2. 类…...

数据安全标准在非结构化数据中台的遵守

在数字化转型的浪潮中&#xff0c;非结构化数据中台作为企业数据管理的核心枢纽&#xff0c;承载着海量且多样的数据资产。这些数据不仅关乎企业的运营决策&#xff0c;更涉及客户隐私、商业机密等敏感信息。因此&#xff0c;确保非结构化数据中台遵守数据安全标准&#xff0c;…...

探索Go语言中的Goroutine并发机制

什么是Goroutine 在Go语言中,Goroutine 是程序中最基本的并发单位。事实上,每个Go程序都会自动创建一个goroutine,那就是主goroutine,程序启动时会立即执行。Goroutine是Go语言中处理并发问题的核心工具,因此理解它的工作原理至关重要。 简而言之,Goroutine是并发执行的…...

实现实时Web应用,使用AJAX轮询、WebSocket、还是SSE呢??

文章目录 短轮询&#xff08;Short Polling&#xff09;长轮询&#xff08;Long Polling&#xff09;Comet “服务器推” &#xff08;这玩意现在用的很少了&#xff0c;了解一下即可&#xff09;WebSocket原理&#xff1a;方法&#xff1a;事件&#xff1a; SSE原理事件 总结 …...

3GPP协议入门——物理层基础(一)

1. 频段/带宽 NR指定了两个频率范围&#xff0c;FR1&#xff1a;通常称Sub 6GHz&#xff0c;也称低频5G&#xff1b;FR2&#xff1a;通常称毫米波&#xff08;Millimeter Wave&#xff09;&#xff0c;也称高频5G。 2. 子载波间隔 NR中有15kHz&#xff0c;30kHz&#xff0c;6…...

关于Java数据结构中集合的一个小知识

在我们以后刷题的过程&#xff0c;我们会遇到一些奇怪的集合数据类型。 如下图 这里&#xff0c;我们以顺序表的集合类为例&#xff0c;我们看到上图函数的返回值类型有点奇怪&#xff0c;其实并不奇怪&#xff0c;也就是穿过去的参数类型是一个顺序表的集合类型&#xff0c;也…...

leetcode41. 缺失的第一个正数,原地哈希表

leetcode41. 缺失的第一个正数 给你一个未排序的整数数组 nums &#xff0c;请你找出其中没有出现的最小的正整数。 请你实现时间复杂度为 O(n) 并且只使用常数级别额外空间的解决方案。 示例 1&#xff1a; 输入&#xff1a;nums [1,2,0] 输出&#xff1a;3 解释&#xf…...

如何准备教师资格证科目三“学科知识与教学能力”的考试与面试?(理科导向:数学/物理)

如何准备教师资格证科目三“学科知识与教学能力”的考试与面试&#xff1f;&#xff08;理科导向&#xff1a;数学/物理&#xff09; ​ 目录 收起 1 前言 1.1 自身经历 1.2 教师资格证的作用 2 知识点题型分数的分布与学习建议 2.1 科目三的知识点分数分布&#xff1a; …...

3.数据类型

作业系统链接 Python 是一门面向对象友好的语言&#xff0c;支持多种内置数据类型&#xff0c;包括整数&#xff08;int&#xff09;、浮点数&#xff08;float&#xff09;、布尔值&#xff08;bool&#xff09;、字符串&#xff08;str&#xff09;、列表&#xff08;list&am…...

Xcode报错:No exact matches in reference to static method ‘buildExpression‘

Xcode报错1&#xff1a;No exact matches in reference to static method buildExpression Xcode报错2&#xff1a;Type () cannot conform to View 这两个报错都是因为在SwiftUI的View的Body里面使用了ForEach循环,却没有在ForEach循环闭包的内部返回视图&#xff0c;而是做了…...

校园安全无小事,EasyCVR视频综合管理平台助力智慧校园视频监控系统全面升级

随着信息技术的飞速发展&#xff0c;智慧校园作为教育信息化的重要载体&#xff0c;正逐步成为提升校园安全管理、优化教育资源配置、增强师生互动体验的关键手段。其中&#xff0c;高效、智能的视频监控系统作为智慧校园不可或缺的一部分&#xff0c;扮演着至关重要的角色。TS…...

通过Python代码发送量化交易信号邮件通知

量化交易利用数学模型和计算机算法来分析市场数据,并生成交易信号,本文将介绍如何使用Python编写一个简单的脚本,通过发送邮件通知量化交易信号。 开启SMTP服务 首先要在发件箱的邮件设置中,将POP3/SMPT服务开启,记录下授权密码,在本地可通过此密码登录,注意有效期和保…...

计算机毕业设计 乡村生活垃圾管理系统的设计与实现 Java+SpringBoot+Vue 前后端分离 文档报告 代码讲解 安装调试

&#x1f34a;作者&#xff1a;计算机编程-吉哥 &#x1f34a;简介&#xff1a;专业从事JavaWeb程序开发&#xff0c;微信小程序开发&#xff0c;定制化项目、 源码、代码讲解、文档撰写、ppt制作。做自己喜欢的事&#xff0c;生活就是快乐的。 &#x1f34a;心愿&#xff1a;点…...

Qwen 2.5:阿里巴巴集团的新一代大型语言模型

Qwen 2.5&#xff1a;阿里巴巴集团的新一代大型语言模型 摘要&#xff1a; 在人工智能领域&#xff0c;大型语言模型&#xff08;LLMs&#xff09;的发展日新月异&#xff0c;它们在自然语言处理&#xff08;NLP&#xff09;和多模态任务中扮演着越来越重要的角色。阿里巴巴集…...

Element UI入门笔记(个人向)

Element UI入门笔记 将页面分割为一级菜单、二级菜单、导航栏三个部分&#xff1b;使用npm下载安装&#xff0c;使用语句npm i element-ui -s; 布局组件 el-form 用于创建和管理表单&#xff1b;从属性上看&#xff1a; :model&#xff1a;用于双向数据绑定&#xff0c;将表单…...