前端---HTML简介
2021-05-06 02:26
YPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
标签：dex 页面跳转 自动调用 动作 val -- eset alt multiple
什么是前端？
? 任何与用户直接打交道的操作界面都可以称之为是一个前端
软件开发架构
? --CS --BS (bs 本质就是cs)
web服务的本质
? 浏览器窗口输入一个网址敲回车发生那些事
? 1. 朝着指定的服务端发送请求
? 2.服务端接收相应的请求
? 3.服务端返回相应的响应
? 4.浏览器接收响应 按照特定的规则渲染页面展示给用户看
HTTP协议
? 超文本传输协议
? 规定了浏览器与服务端之间数据传输的格式
-
1，四大特性
-
1 ，基于请求响应
? 一次请求对应一次响应
2，基于TCP/IP作用于应用层之上的协议
-
3，无状态
? 不保留客户端的状态，无论你来多少次，我都待你如初恋
-
4，无连接
? 长连接 websocket（类似于http协议的大补丁） 聊天室相关
-
-
2，数据格式
? 请求格式
? - 请求首行（请求方式 协议版本）
? - 请求头（一大堆 k，v 键值对）
- （ 空 一 行 通知服务器一下不再有请求头）
? - 请求体（携带的数据 并不是一直都有 有时候可能是空的 取决于你的请求方式）
?
? 响应状态码
? 用数字来表示一大堆提示信息
? 1XX : 服务端已经成功接收到客户端的数据正在处理 你可以继续提交
? 2XX : 200请求成功 服务端已经返回了你想要的数据
? 3XX : 重定向(原本想访问A但是内部自动给你转到了B上面)
? 4XX : 404请求资源不存在,403你当前不具备请求该资源的条件
? 5XX : 500服务端内部错误 机房卓火了 宕机 爆炸了
? 公司内部可以自己定制自己的响应状态码
请求方式：
-
get请求：
-
超服务端要资源（获取数据）
? 类似于浏览器窗口输入网址获取页面
-
-
post请求
-
朝服务端提交请求
? 类似于登陆注册功能
-
HTML
? 超文本标记语言
? 如果你想让你的页面能够被浏览器识别并且展示出好看的样子 你就必须是写HTML代码
? 浏览器能够识别的语言非常少
? HTML/XML CSS JS
? XML也可以书写前端页面 主要用于odoo框架中 书写企业内部管理软件（erp）
? HTML注释：
? 注释是代码之母
单行注释： 多行注释：
? 补充：由于HTML页面结构比较复杂，那日同比较多，不便于后期的维护 修改通常在写页面的时候 习惯用下面的方式来人为的划分代码区域
HTML文档结构
:head内存放的内容不是给用户看的，是给浏览器去识别做响应操作的 :body内部存放的内容就是浏览器展示给用户看到的花里胡哨的页面
HTML文档打开方式
- 1.自动调用浏览器打开
- 2.手动查找路径后选择浏览器打开
标签分类：
- 双标签
- 自闭和标签
head内常用标签
title：定义网页标题 style：内部支持直接写css代码 link：引入外部的css文件 script： 1.内部可以直接编写js代码 2.可以通过src属性引用外部js代码 meta： name属性 keywords description
什么是URL？
- URL：统一资源定位符
body内常用标签
基本标签：
h1~h6：标题标签 s:删除线 b:加粗 u:下划线 i：斜体 p：独占一行 br：换行 hr：分割线
特殊符号：
空格a大于b a > b
a小于b a < b
a&b a & b
人民币 ¥10000000
版权标识 ©
注册商标 ®
常用标签：
-
div 块级标签 span 行内标签 两个标签没什么特殊意义，主要用来做前期的页面布局img 图片标签
-
src 1.可以写一个网站图片地址 2.还可以写一个本地图片地址 3.url（自动朝该url发送get请求要数据） alt 当图片加载不出来时，默认展示的提示信息 title 当鼠标悬浮在图片上时默认展示的提示信息 width, height 修改一个另外一个会自动等比例缩放 也可以两个都自定义修改??链接标签 a 标签
href 1.放一个url 点击就会跳转到该url所对应的资源 target 控制是否在当前页跳转 默认实在当前页跳转 _self 新建页面跳转 _blank 锚点功能 href不单单可以写url 也可以写另外一个a标签id值 点击就会跳转到该id值所对应的a标签所在的位置
标签应该具备的属性
-
id属性：类似于身份证号 用来唯一标识当前html页面中的某一个标签
? 在同一个html页面中，id值不能重复
- class 属性：类似于面向对象的继承
? 直接引用别的类的样式
列表标签
无序列表（用的比较多） ul li （ul套li） 只要页面上出现了比较有规则排列的文本 基本上都可以用无序列表来实现 ---------------------------无序列表
- 111
- 222
- 333
有序列表
- 哈哈哈
- 呵呵呵
- 嘿嘿嘿
标题列表
- 标题1
- 内容1
- 内容2
- 标题2
- 内容1
- 内容2
表格标签（* * * * * )
展示网站数据的时候 一般情况下可以使用表格标签
写表格标签 先写结构 然后写数据 一个tr就是一行 th和tr之分 一个加粗一个不加粗 通常情况下表头用th， 表单内容用td
表单标签（* * * * * * ）
-
form标签
获取用户输入（输入，选择， 上传文件......）并且将数据打包发送给后端
-
action参数
用来控制数据提交的路径（到底朝哪个后端服务器提交数据）
? 三种写法：
? 1. 不写 ，默认就是朝当前该页面所在的地址提交数据
? 2. 全路径（https://www.baidu.com)
3. ? 只写路径后缀 （/index/） -
method
控制提交方式
form表单默认是get请求， method=‘get’
可以指定post请求， method=‘post’
-
enctype
控制的数据提交的编码格式
默认情况下form表单是不能直接发送文件的
如果你要发送文件 必须将该参数由默认的urlencoded改为formdata
获取用户输入 input标签 该标签是一个行内标签
input 类似于前端的变形金刚
type属性
text 普通文本
password 密文
date 日期
radio 多选一
checkbox 多选多
默认选择 checked=”checked“
当标签的属性名和属性值相同的时候，可以指写属性名
女
简写
女
reset 重置
button 普通按钮
submit 出发form表单提交动作
file 获取文件
select标签 下拉框
一个个选项就是一个个option标签
默认是单选
可以加一个multiple改成多选
如何让option标签默认选中
加selected=”selected“
textarea标签 获取大段文本
label通常是配合input一起使用的
for用来填写对应的input标签id值
点击label标签内的内容 会自动让对应的input标签 聚焦
能够触发form表单提交数据的按钮（* * * * * * ）
可以通过value属性来指定按钮文本内容
input 获取到的用户输入就类似于字典的value
input 中的name属性就类似于字典的key注意事项
1.获取用户输入的标签 都是用value属性来存放用户的输入
获取用户输入的标签都应该有name属性 就类似于字典的key
value属性就类似于字典的value
2.如何给input设置默认
可以直接给input标签加value属性
3.input框如何设置提示信息
username:
Flask框架
pip3 install Flask
get请求能够携带参数 但是参数的携带方式是直接跟在url后面的
url?xxx=ooo&yyy=bbb&lll=ccc
特点:
1.数据全是明文
2.数据大小有限制 大概应该可能在4KB左右吧...
3.get请求不应该携带隐私信息
标签的分类：
? 1，块儿级标签
? 独占一行 h1~h6 p br hr div
? 块儿级标签内部可以嵌套任意的块儿级标签和行内标签
? 特例：p虽然是块儿级标签， 但是他的内部只能嵌套行内标签 不能嵌套块儿级标签
? 如果嵌套了 没有问题 只是不符合html语法规范
? 2， 行内标签 u s i b span
? 自身文本多大 就占多大
? 行内标签内部不能嵌套块级标签和行内标签ssV
前端---HTML简介
标签：dex 页面跳转 自动调用 动作 val -- eset alt multiple
原文地址：https://www.cnblogs.com/lishuangjian/p/12104212.html