python-web开发（一）知识储备准备
本篇博客适合新手入门
1. HTTP协议
HTTP (HyperText Transfer Protocol)，即超文本传输协议，是互联网上应用最为广泛的一种网络协议。HTTP是利用TCP在Web服务器和客户端之间传输信息的协议。客户端使用Web浏览器发起HTTP请求给Web服务器，Web服务器发送被请求的信息给客户端。
(1)建立连接:客户端通过TCP/IP协议建立到服务器的TCP连接。
(2)请求过程:客户端向服务器发送HTTP协议请求包，请求服务器里的资源文档。
(3)应答过程:服务器向客户端发送HTTP协议应答包，如果请求的资源包含有动态语言的内容，那么服务器会调用动态语言的解释引擎负贵处理“动态内容”，并将处理后得到的数据返回给客户端。由客户端解释HTML文档，在客户端屏幕上渲染图形结果。
(4)关闭连接:客户端与服务器断开。
1.1 协议请求方法
| 方法 | 描述 |
|---|---|
| GET | 请求指定的页面信息，并返回实体主体向指定资源提交数据进行处理请求(例如提交表单或者上传文件)。数据被包含 |
| POST | 在请求体中。POST请求可能会导致新的资源的建立或已有资源的修改 |
| HEAD | 类似于GET请求，只不过返回的响应中没有具体的内容，用于获取报头 |
| PUT | 从客户端向服务器传送的数据取代指定的文档的内容 |
| DELETE | 请求服务器删除指定的页面 |
| OPTIONS | 允许客户端查看服务器的性能 |
1.2 状态码如下表
| 项目 | Value |
|---|---|
| 1** | 信息、请求收到，继续处理 |
| 2** | 成功，行为被成功地接受、理解和采纳 |
| 3** | 重定向，为了完成请求，必须进一步执行的动作 |
| 4** | 客户端错误，请求包含语法错误或者请求无法实现 |
| 5** | 服务器错误，服务器不能实现一种明显无效的请求 |
1.3 使用浏览器开发者模式
使用Google浏览器->F12->Network->Headrs，可查看相关信息
这里由于篇幅问题不做描述
2. HTML
HTML是用来描述网页的一种语言。HTML指的是超文本标记语言(HyperTextMarkupLanguage),它不是一种编程语言，而是一种标记语言。标记语言是一套标记标签，这种标记标签通常被称为HTML标签，它们是由尖括号包围的关键词，比如。HTML标签通常是成对出现的，比如和。标签对中的第一个标签是开始标签，第二个标签是结束标签。Web浏览器的作用是读取HTML文档，并以网页的形式显示它们。浏览器不会显示HTML标签，而是使用标签来解释页面的内容
2.1 结构
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body></body>
</html>
2.2 标签描述
2.1.1普通标签与自闭合标签
普通标签：有开始和结束标记，中间可以插入相关内容或者其他标签
自闭合标签：不是成对出现，中间不能插入内容或者其他标签，只能在标签内部定义自身属性
常见自闭合标签：
<meta />
<link />
<br />：换行
<hr />
<img />
<input />2.1.2 <*!DOCTYPE HTML>
声明这是一个HTML文档
2.1.3 <html>和</html>
告诉浏览器，页面从<html>开始，到</html>结束
2.1.4 <head>和</head>
声明页面头部
2.1.5 <title>和</title>
声明页面标题，是一个html页面必须要有的
2.1.6 <*meta />
描述html页面元数据，这些数据不会展示在页面上，name描述信息如下
| 项目 | Value |
|---|---|
| name属性值 | 描述信息 |
| keyword | 网页关键字（可以多个） |
| description | 网页的描述 |
| author | 网页的作者 |
| copyrightt | 版权信息 |
2.1.7 <*link />
链接外部样式文件
2.1.8 <script>和</script>
声明前端脚本
2.1.9 <style>和</style>
声明样式信息
2.1.10 <body>和</body>
声明页面主题部分
2.1.11 <! --注释–>
注释，用于解释文本，不参与运行
2.1.12 段落与文字
段落和文字是静态页面的重要组成部分
| 标签 | 描述 |
|---|---|
| <h1>到<h6> | 标题 。align属性：设置标题在页面的位置，默认是居左，center(居中)，right(居右) |
| <p>段落文字</p> | 段落，在段落标签中的文字自动换行 |
|   | 空格符 |
| <br /> | 换行 |
| <hr /> | 水平线 |
| <sup> </sup> | 上标标签 |
| <sub></sub> | 下标标签 |
| <b></b>或者<strong></strong> | 粗体标签 |
| <i></i>和<em></em> | 斜体标签 |
| <s></s> | 删除线标签 |
| <u></u> | 下划线标签 |
练习
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>test</title><meta name="用于学习"><meta name="keyword" content="python css http tcp js html"><meta name="author" content="桃子"><meta name="copyright" content="2-9">
</head>
<body>
<h1 align="center">各科小常识</h1><h3 align=""><b>语文</b></h3>
<p> 《三国演义》是中国四大名著之一。元末明初小书架罗贯中所著，是中国第一部长篇历史演义小说。</br> 描写从东汉末年到西晋年初之间近100年的历史风云。
</p>
<hr /><h3>数学</h3>
<p> 勾股定理直角三角形：a<sup>2</sup>+b<sup>2</sup>=c<sup>2</sup>
</p>
<hr />
<h3>英语</h3>
<p> no english
</p>
<hr /><h3>化学</h3>
<p> H<sub>2</sub>SO<sub>4</sub>
</p>
<hr /><h3>经济</h3>
<p> 版权符号：©<br /> 注册商标：®
</p>
<hr />
</body>
</html>
美化界面
div标签
对HTML代码进行结构上的划分，使得整个代码更加具有逻辑性和可读性
<div id="20" class="yy" align=""><h3>经济</h3><p> 版权符号：©<br /> 注册商标：®</p>
</div>
设置背景，字体颜色、大小
| style属性标签 | 描述 |
|---|---|
| <font size=""></font> | 设置字体大小 |
| style="color:blue | 设置字体颜色 |
| style=“background-color:gold” | 设置背景色 |
例：
<div id="20" class="yy" align=""style="background-color:gold"><h3style="color:blue;">经济</h3> <font size="15">版权符号：©</font><br /> 注册商标：®⑩
</div>
数字外加圈代码
① ①
② ②
③ ③
④ ④
⑤ ⑤
⑥ ⑥
⑦ ⑦
⑧ ⑧
⑨ ⑨
⑩ ⑩
列表
有序列表
有序列表：<ol></ol>，各个列表项是有序的，使用<li></li>标记列表项
type属性：声明列表项的标记符号，默认是数字
| 属性 | 类型 |
|---|---|
| 1 | 数字1、2、3、4 |
| a | 小写英文字母 |
| A | 大写英文字母 |
| ⅰ | 小写罗马数字 ⅰ，ⅱ，ⅲ，ⅳ，ⅴ，ⅵ |
| Ⅰ | 大写罗马数字 Ⅰ，Ⅱ，Ⅲ，baiⅣ，Ⅴ |
<div id="preface" class="1"style="color:red;"><h1 align="center"><font size="20">2021年编程语言排行榜</font></h1><ol type="i"style="color:blue"><li><font size="10">c</font></li><li><font size="10">java</font></li><li><font size="10">python</font></li><li><font size="10">c++</font></li><li><font size="10">c#</font></li></ol>
</div>
无序列表
无序列表：<ul></ul>标记，使用<li></li>标记列表项
type属性：声明列表项的标记符号，默认是●
| 属性 | 类型 |
|---|---|
| disc | ● |
| circle | 〇 |
| square | ■ |
<div id="preface" class="1"style="color:red;"><h1 align="center"><font size="20">2021年编程语言排行榜</font></h1><ul type="circle"style="color:blue"><li><font size="10">c</font></li><li><font size="10">java</font></li><li><font size="10">python</font></li><li><font size="10">c++</font></li><li><font size="10">c#</font></li></ul>
表格
基本结构
table标签：标记表格，
border：设置表格边框的宽度
cellspacing：指定单元格之间的间距
cellpadding：指定单元格内容与边框的距离
tr标签：标记表格中的一行，
td标签：标记单元格，
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<table border="10"> <!--声明表格--><tr> <!--声明表格中的行--><td> <!--声明表格中的一个单元格-->单元格1</td><td> <!--声明表格中的一个单元格-->单元格2</td></tr>
</table>
</body>
</html>
图片
<img />：标记图片
语法：<img src=“图片地址” alt=“图片描述” title=“图片描述” width=“宽度” height=“高度” />
属性说明：
src：描述图片地址，可以是本地地址，也可以是在线地址
alt：图片描述，给搜索引擎看的
title：图片描述，与alt的值相同，给用户看的
width：设置图片的宽度
height：设置图片的高度
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><img src="123.jpg" alt="图片描述" title="图片描述" width="600" height="680" />
<img src="https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=313184173,121254158&fm=26&gp=0.jpg" width="600" height="680" /><h2>未设置对齐方式的图像：</h2>
<p>图像 <img src ="123.jpg" width="20" height="20" /> 在文本中</p>
<h2>已设置对齐方式的图像：</h2>
<p>图像 <img src ="123.jpg" width="20" height="20" align="bottom"> 在文本中</p>
<p>图像 <img src ="123.jpg" width="20" height="20" align="middle"> 在文本中</p>
<p>图像 <img src ="123.jpg" width="20" height="20" align="top"> 在文本中</p>
<p>请注意，bottom 对齐方式是默认的对齐方式。</p>
</body>
</html>
超链接
<a></a>：标记超链接
语法：<a href="url" target="value">说明</a>href属性：用于指定链接的地址，必须的target属性：用于指定新页面的打开方式
① _self：默认，表示在当前窗口打开链接
② _blank：表示在新窗口打开链接
③ _top：表示在顶层框架中打开链接
④ _parent：表示在上一层框架中打开链接
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<a href="https://www.baidu.com/" target="_parent">百度</a><hr />
<a href="https://www.bilibili.com"><img src ="123.jpg" width="20" height="20" align="bottom"></a>
</body>
</html>
表单
作用：接收用户输入，并且将数据提交到指定的脚本
<form></form>：标记表单
属性：
1. name：命名
2. action：指定表单数据提交到哪个地址进行处理
3. method：指定提交表单的http请求类型，主要是get和post
target属性：用于指定新页面的打开方式
_self：默认，表示在当前窗口打开链接
_blank：表示在新窗口打开链接
_top：表示在顶层框架中打开链接
_parent：表示在上一层框架中打开链接input标签：接收用户输入
语法：<input id="xx" name="xx" class="xx" type="类型" value="默认字符" maxlength="字符数" style="xxx">
type属性：用于指定输入框的类型
text：文本框，输入的内容正常显示
password：密码框，输入的内容隐藏显示
radio：单选框
checkbox：复选框
file：上传文件
reset：重置按钮 <form><table border=“1”><input type=“reset”></form>
submit：提交按钮
image：图片按钮 <input type="image" src="./sina.jpg">
<form>First name:<br>
<input type="text" name="firstname">
<br>Last name:<br>
<input type="text" name="lastname">
</form>
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<form>性 别<br /><input name="sex" type="radio" /> 男<br /><input name="sex" type="radio" /> 女
</form>
<form>我喜欢的<br /><input name="sex" type="checkbox" /> python<br /><input name="sex" type="checkbox" /> 电影
</form>
</body>
</html>
下拉列表:
<select></select>：标记下拉列表
<option></option>：标记下拉列表中的选项
文本域
剩下的明天写喽
<textarea></textarea>：标记文本域
语法：<textarea rows=“行数” cols=“列数”></textarea>
框架
<iframe></iframe>：标记框架
语法：<iframe src=“框架源文件” width=“n” height=“n”></iframe>
更多的知识
css
https://www.w3school.com.cn/css/index.asp
JavaScript
https://www.w3school.com.cn/js/index.asp
python-web开发（一）知识储备准备相关推荐
- pythonweb开发-手把手教你写网站：Python WEB开发技术实战
摘要:本文详细介绍了Python WEB开发的基础入门.以一个博客站点的开发为例讲解了基于Django框架开发WEB站点的全过程.通过本文的学习可以快速掌握基于Django的Python WEB的开发 ...
- python web-手把手教你写网站：Python WEB开发技术实战
摘要:本文详细介绍了Python WEB开发的基础入门.以一个博客站点的开发为例讲解了基于Django框架开发WEB站点的全过程.通过本文的学习可以快速掌握基于Django的Python WEB的开发 ...
- java和python的web自动化有什么区别-Java Web开发和Python Web开发之间的区别
今天的文章讨论了Java Web开发和Python Web开发之间的区别.我不鼓励我们在这里从Java Web迁移到Python Web开发.我只是想谈谈我的感受.它不一定适合所有情况,仅供我们参考. ...
- pythonweb开发-Python Web开发从入门到精通
Python Web开发从入门到精通循序渐进地讲解了Python Web开发的核心知识,并通过具体实例的实现过程演示了Web开发程序的流程.Python Web开发从入门到精通共15章,内容包括Pyt ...
- python论坛app_理解python web开发，轻松搭建web app！
大家好,今天分享给大家的是理解python web开发,轻松搭建web app,希望大家学有所获! 因为 python代码的优雅美观且易于维护这一特点,越来越多的人选择使用 Python做web开发. ...
- python notebook右侧网页_《Python web开发》笔记 一：网页开发基础
网页基础知识 网页的构成 网页由html.css和Javascript构成,html是框架,CSS是样式和装饰,JS则是各项功能实现.我们把网页的组成类比成一栋房子,Html相当于房子的结构,CSS相 ...
- python开发一个自己的技术网站_手把手教你写网站：Python WEB开发技术实战
摘要:本文详细介绍了Python WEB开发的基础入门.以一个博客站点的开发为例讲解了基于Django框架开发WEB站点的全过程.通过本文的学习可以快速掌握基于Django的Python WEB的开发 ...
- python web开发 CSS基础
文章目录 1. 基础知识 2. ID,Class 选择器 3. CSS盒子模型 4. 嵌入CSS样式 4.1 内联样式表 4.2 内部样式表 4.3 外部样式表 learning from <p ...
- python在线搭建教程_理解python web开发，轻松搭建web app！
大家好,今天分享给大家的是理解python web开发,轻松搭建web app,希望大家学有所获! 因为 python代码的优雅美观且易于维护这一特点,越来越多的人选择使用 Python做web开发. ...
- flask web开发:基于python的web应用开发实战_在知乎上学 Python Web 开发篇
通知: 1. 最近我们将进行2期学习小组,面向完全零基础的Python入门学习小组已经开始,第一次任务的讨论将于明晚(15号)进行,现在上车还来得及 2. 另有一期数据可视化小组将于年前启动,第一次讨 ...
最新文章
- 美多商城之验证码(短信验证码2)
- 深度全解卷积神经网络（附论文）
- Runtime底层原理--Runtime简介、函数注释
- 10个精选的颜色选择器Javascript脚本及其jQuery插件
- freertos源码详解与应用开发 pdf_互联网企业面试必问Spring源码？搞定Spring源码，看完这篇就够了...
- matplotlib给坐标轴特定的位置加上文字
- 更改eclipse中jsp默认编码格式为UTF-8
- 看过曹县国际车展，我闯入了魔幻的塞伯坦
- 如何用多线程方式，提高rabbitmq消息处理效率？
- 在浏览器中将表格导入到本地的EXCEL文件，注意控制内存
- linux shell 判断ELF文件,linux file命令查看elf文件信息
- c语言编程汉诺塔问题,C语言解决汉诺塔问题
- 淘宝平台搜索规则变化，怎么提升搜算转换率？
- Oracle第十五章：视图
- Android高德地图点击大头针更换大头针图片
- 解决foxmail不保存皮肤 有时会还原成默认蓝色配色
- 二手交易市场的数据流图
- 汇编语言字符串操作指令movs，和逻辑段寄存器【学习笔记】
- java web聊天室原理_java web利用mvc结构实现简单聊天室功能
- 异物入侵自动报警系统-matlab