day42

软件开发架构
c/s
b/s
b/s本质也是c/s

统一接口(******)

web服务的本质
请求 响应
浏览器输入网址 回车发生了哪些事
1.朝着指定的服务器地址发送请求
2.服务端接收请求 并处理
3.返回相应的响应
4.浏览器接收并渲染出好看的页面 给用户看

请求方式
	1.get请求
		朝服务器要资源
		eg:敲www.baidu.com
		
	2.post请求
		朝服务器提交数据
		eg:登录功能

总分总

HTTP协议
超文本传输协议
规定了服务端与浏览器数据传输的数据格式

1.四大特性
	1.基于TCP/IP作用于应用层之上的协议
	
	2.基于请求响应
		请求对应响应
	
	3.无状态
		不保存客户端状态
		无论来多少次 都当你如初见
		
		cookie  session
		
	4.无连接
		长连接  websocket  聊天室
		
2.数据格式
	请求格式
		请求首行(请求方式 协议版本)
		请求头(一大堆k:v键值对)
		
		请求体(敏感信息  密码 身份证号)

​
​ 响应格式
​ 响应首行(请求方式 协议版本)
​ 响应头(一大堆k:v键值对)
​

		响应体(给用户看的数据)

3.响应状态码
	用数字来表示一串文字需要表达的意思
	1XX:服务端已经成功接收到了你的请求 正在处理 你可以继续提交其他数据
	2XX:服务端成功响应了相应的数据(200)
	3XX:重定向
	4XX:（404请求资源不存在） （403你当前不符合某一些条件 无法正常访问）
	5XX:服务器内部错误(500)

​
HTML
​ 超文本标记语言

文件的后缀名
文件的后缀名是给人看的 对于计算机来说 全都是二进制
之所以不同的后缀名有不同的功能 那是我们程序员自己认为的定制的

注释是代码之母
HTML的注释

<!--
多行注释1
多行注释2
多行注释3
-->

我们在搭建页面的时候 通常会利用注释来划分区域
<!--导航条开始-->

<!--导航条结束-->
<!--侧边栏开始-->

<!--侧边栏结束-->

HTML的文档结构

不是给人看的 给浏览器看的
body内的代码才是给人看的

​

hello s12~

click me

标签的分类1：
1.双标签(h1，a)
2.自闭合标签(img)

head内常用标签
title 定义网页标题
style 内部支持写css代码
link 引入外部css样式文件
script 内部可以直接写js代码 也可以引入外部js文件
meta 定义网页源信息

浏览器上你所能看到的花里胡哨的页面 背后都是HTML代码而已

body内常用标签
h1~h6 标题标签
p 段落标签 一个p就是一行内容
s 删除线
b 加粗
u 下划线
i 斜体
br 换行
hr 一条分割线

body内特殊符号
  空格
& &
¥ ￥
> >
< <
© ©
® ®

标签的分类2：
1.块儿级标签 h1~h6 p br hr div
独占一行
1.块儿级标签内可以嵌套其他块儿级和行内标签
2.注意:p标签虽然是快儿级标签 但是他的内部不能嵌套任何快儿级标签 只能嵌套行内标签(******)

2.行内标签    s i u b   span
	内部文本多大 就占多大
	行内不能嵌套行内和块儿级

---

标签通常应该有两个属性
id 就类似于是身份证号 每一个标签 都应该有id值 并且在同一个html文档中 标签的id不能重复
class 类属性 有点类似于面向对象的继承 class = 'c1 c2 c3' 你这个标签就会拥有c1 c2 c3的所有样式

---

body内重要的标签
div 一块区域 你可以往这块儿区域内填写任何内容
span
div和span是前期构建网页的基本骨架

a  链接标签
	1.跳转功能     href参数控制跳转的地址
		这个地址如果在你的机器上如果没有被点击过那么默认是蓝色
		只要点过一次之后  之后颜色 都是紫色
		<!--<a href="https://www.sogo.com">点我点我</a>-->
		
		a标签默认是在当前窗口跳转
		你可以指定 新建窗口打开
		target = "_self"
		target = "_blank"
		
	2.锚点功能
		给a标签设置id值
		然后在href中书写对应的a标签id值 点击即可跳转到对应的位置
		<a href="" id="a1">文章开头</a>
		<div style="background-color: red;height: 1000px"></div>
		<div style="background-color: green;height: 1000px"></div>
		<div style="background-color: orange;height: 1000px"></div>
		<a href="" id="a2">文章中部</a>
		<div style="background-color: black;height: 1000px"></div>
		<div style="background-color: green;height: 1000px"></div>
		<div style="background-color: orange;height: 1000px"></div>
		<a href="#a1">回到顶部</a>
		<a href="#a2">回到中部</a>

​
​
​
​ img 图片标签
​ src
​ 1.图片地址 网上的地址也可以是你的本地图片地址
​ 2.url(网址) 自动朝该网址发送get请求 获取图片资源

​
​ alt
​ 当图片加载不出来的时候 展示的提示信息

​
​ title
​ 鼠标悬浮上去之后展示的提示信息

​
​ width和height
​ 这两个参数 你只需要设置一个 就可以 默认是等比例缩放
​ 两个都调整的话 图片就会失真

​

​
列表标签
​ 无序列表
​ ul
​ li
​
​ type参数
​ disc（实心圆点，默认值）
​ circle（空心圆圈）
​ square（实心方块）
​ none（无样式）

​
​ 有序列表(了解)
​ ol
​ li
​

	type参数

		1 数字列表，默认值
		A 大写字母
		a 小写字母
		Ⅰ大写罗马
		ⅰ小写罗马
标题列表(了解)
	dl
		dt  小标题
		dd  小章节

表格标签
展示数据 一般都用到表格标签

一个tr就表示一行

username	password	hobby	is_delete
jason	123	study	0