基本标签
<b>加粗</b>
<i>斜体</i>
<u>下划线</u>
<s>删除<s/>
<p>段落标签</p>
<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>
<br>---换行
<hr>---水平线
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>基本标签</title> </head> <body> <h1>标题1</h1><!标题1----> <h2>标题2</h2><!标题2----> <h3>标题3</h3><!标题3----> <h4>标题4</h4><!标题4----> <h5>标题5</h5><!标题5----> <h6>标题6</h6><!标题6----> <b>加粗</b><!加粗----> <br> <i>斜体</i><!斜体----> <br> <u>下划线</u><!下划线----> <br> <s>删除</s><!删除----> <hr><!水平线----> </body> </html>
特殊字符
空格
> >
< <
& &
￥ ¥
版权 ©
注册 ®
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>特殊标签</title> </head> <body> <p>空 格</p><!空格符----> 1<2<!小于号----> <br><! 换行---> 0>1<!大于号----> <br> &<!&号----> <br> ©<!版权号----> <br> ®<!注册号----> <br> ¥<!人民币符号----> </body> </html>
div标签和span标签
div标签用来定义一个块级元素，并没有实际的意义。主要通过CSS样式为其赋予不同的表演。
span标签用来定义内联(行内)元素，并无实际的意义。主要通过CSS样式为其赋予不同的表演。
块级元素与行内元素的区别:
所谓块元素，是以另起一行开始渲染的元素，行内元素则不需另起一行。如果单独在网页中插入这两个元素，不会对页面产生任何的影响。
这两个元素是专门为定义CSS样式而生的
注意:
关于标签的嵌套通常块级元素可以包含内联元素或某些块级元素，但内联元素不能包含块级元素，它只能包含其它内联元素。
p标签不能包含块级标签，p标签也不能包含p标签。
<img src="图片的路径" alt="图片未加载成功时的提示" title="鼠标悬浮时提示信息" width="宽" height="高(宽高两个属性只用一个会自动等比缩放)">
a标签
超链接标签
所谓的超链接是指从一个网页指向一个目标的连接关系，这个目标可以是另一个网页，也可以是相同网页上不同位置，还可以是一个图片，一个电子邮件地址，一个文件，甚至是一个应用程序。
====
url
什么是url？
url是统一资源定位器的缩写，也被称为网页地址，是因特网上标准的资源的地址。
url地址由4部分组成
第一部分:为协议:http:// 、 ftp://等
第二部分:为站点地址:可以是域名或IP地址
第三部分:为页面在站点中的目录:stu
第四部分:为页面名称，例如 index.html
各部分之间用 / 符号隔开
<a href="url" target="_blank">文本内容</a>
href属性指定目标网页地址。该地址可以有几种类型:
1.绝对URL 指向另一个站点
2.相对URL 指当前站点中确切的路径
3.锚URL 指向页面中的锚
target
1._blank表示在新标签页中打开目标网页
2._self表示在当前标签页中打开目标网页
列表
无序列表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>无序列表</title> </head> <body> <ul type="disc"> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ul> <ul type="circle"> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ul> <ul type="square"> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ul> <ul type="none"> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ul> </body> </html>
type属性
disc(实心圆点，默认值)
circle(空心圆圈)
square(实心方块)
none(无样式)
有序列表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>有序列表</title> </head> <body> <ol type="1"> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ol> <ol type="A"> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ol> <ol type="a"> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ol> <ol type="I"> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ol> <ol type="i"> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ol> </body> </html>
type属性
1数字列表，默认值
A大写字母
a小写字母
I大写罗马
i小写罗马
标题列表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>标题列表</title> </head> <body> <dl> <dt>标题1</dt> <dd>内容1</dd> <dd>内容2</dd> <dd>内容3</dd> <dt>标题2</dt> <dd>内容1</dd> <dd>内容2</dd> <dd>内容3</dd> </dl> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表格</title> </head> <body> <table border="1" cellspacing="2" cellpadding="2" > <thead> <tr> <th>序号</th> <th>姓名</th> <th>爱好</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>张三</td> <td>睡觉</td> </tr> <tr> <td>2</td> <td>李四</td> <td></td> </tr> </tbody> </table> </body> </html>
表格是一个二维数据空间，一个表格由若干个行组成，一个行又有若干单元格组成，单元格里可以包含文字、列表、图案、表单、数字符号、预置文本和其他的表格等内容。
表格最重要的目的是显示表格类数据。表格类数据是指最合适组织为表格格式(即按行和列组织)的数据。
属性
border:表格边框
cellpadding:内边框
cellspacing:外边框
width:像素 百分比(最高通过CSS来设置长宽)
rowspan:单元格竖跨多少行
colspan:单元格横跨多少列(即合并单元格)
form
功能:
表单用于向服务器传输数据，从而实现用户与web服务器的交互
表单能够包含input系列标签，比如文本字段、复选框、单选框、提交按钮等等。
表单还可以包含textarea、select、fieldset和label标签
表单属性
accept-charset 规定在被提交表单中使用的字符集(默认:页面字符集)
action 规定向何处提交表单的地址(URL)(提交页面)。
autocomplete 规定浏览器应该自动完成表单(默认:开启)。
enctype 规定被提交数据的编码(默认:url-encoded)。
method 规定在提交表单时所用的HTTP方法(默认:GET)。
name 规定识别表单的名称(对于 DOM使用:document.form.name)。
novalidate 规定浏览器不验证表单
target 规定action属性中地址的目标(默认:_self)。
<input>元素会根据不同的type属性，变化为多种形态。
text 单行输入文本 <input type="text"/>
password 密码输入框 <input type="password"/>
date 日期输入框 <input type="date"/>
checkbox 复选框 <input type="checkbox" checked="checked"/>
radio 单选框 <input type="radio"/>
submit 提交按钮 <input type="submit" value="提交">
reset 重置按钮 <input type="reset" value="重置">
button 普通按钮 <input type="button" value="普通按钮">
hidden 隐藏输入框 <input type="hidden">
file 文本选择框 <input type="file">
属性:
name :表单提交时的‘键‘，注意和id的区别
value:表单提交对应项的值
type=‘button‘,‘reset‘,‘submit‘时，为按钮上显示的文本的内容
type=‘text‘,‘password‘,‘hidden‘时，为输入框的初始化
type=‘checkbox‘,‘radio‘,‘file‘,为输入相关联的值
checked:radio和checkbox默认被选中的项
readonly:text和password设置只读
disabled:所有input均适用
select标签
属性
multiple:布尔属性,设置后为多选,否则默认单选
disabled:禁用
selected:默认选中该项
value:定义提交时的选项值
label标签
定义:<label>标签为input元素定义标签(标记)
说明:
1.label元素不会向用户呈现任何特殊效果。
2.<label>标签的for属性值应当与相关元素的id属性值相同。
textarea多行文本
属性说明:
name:名称
rows:行数
cols:列数
disabled:禁用
form表单注意事项:
action
method默认是get
enctype数据编码格式
form表单获取用户输入的标签都必须有name属性
form提交数据必须借助于input标签type类型等于submit按钮才能触发提交效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>注册表单</title> </head> <body> <form action="http://127.0.0.1:5000/reg" method="post" enctype="multipart/form-data"> <p> username: <label for="l1"> <input type="text" name="username" id="l1"> </label> </p> <p> password: <label for="l2"> <input type="password" name="password" id="l2"> </label> </p> <p>gender: <label for=""> <input type="radio" name="gender" checked value="1">男<!checked 设置为默认值---> <input type="radio" name="gender" value="0">女 </label> </p> <p>birthday: <label for=""> <input type="date" name="birthday"> </label> </p> <p>hobby: <label for=""> <input type="checkbox" name="hobby" value="basketball">篮球 <input type="checkbox" name="hobby" value="football">足球 <input type="checkbox" name="hobby" value="volleyball">排球 </label> </p> <p>省市: <select name="provinces" id=""> <option name="sh">上海</option> <option name="sz">苏州</option> <option name="bj">北京</option> </select> </p> <p>省市: <select name="provinces" id="" multiple><!multiple设置多选---> <option name="sh">上海</option> <option name="sz">苏州</option> <option name="bj">北京</option> </select> </p> <p>市区: <select name="city" id=""> <optgroup label="苏州"> <option name="gs">姑苏区</option> <option name="wz">吴中区</option> <option name="xc">相城区</option> </optgroup> <optgroup label="上海"> <option name="hp">黄浦区</option> <option name="pd">浦东区</option> <option name="ja">静安区</option> </optgroup> </select> </p> <p>my_file: <label for=""> <input type="file" name="my_file"> </label> </p> <p>自我介绍： <label for=""> <textarea name="self_introduction" rows="10" cols="30"> </textarea> </label> </p> <p> <input type="submit" value="注册"> <input type="reset" value="重置"> <input type="button" value="按钮"> </p> </form> </body> </html>
from flask import Flask, request, redirect # 实例化flask对象 app = Flask(__name__) # 定义项目路由 @app.route(‘/reg‘, methods=[‘GET‘, ‘POST‘]) def reg(): print(request.form) print(request.files) obj = request.files[‘my_file‘] obj.save(‘a.txt‘) return ‘收到了！‘ if __name__ == ‘__main__‘: app.run()
原文：https://www.cnblogs.com/ShenJunHui6/p/10638516.html