web基础01
web服务端的本质
- 朝着指定的服务器发送请求
- 服务端收到请求并处理
- 返回相应的相应
- 游览器接收并渲染出好看的页面
HTTP协议
超文本传输协议：规定了服务端与游览器数据传输的数据格式
四大特性：
- 基于TCP/IP作用与应用层之上的协议
- 基于请求响应
- 无状态：不保存客户端状态，无论来多少次(cookies，session)
- 无连接：一次性连接，请求响应结束就没了（长连接 websocket 聊天室）
数据格式：
请求格式：
请求首行(请求方式，协议版本)
请求头(一大堆k:v键值对)
空一行
请求体(敏感信息，密码，身份证)
响应格式：
响应首行(请求方式，协议版本)
响应头(一大堆k:v键值对)
空一行
响应体(给客户看的))
响应状态：
用数字来表示一串文字需要表达的意思
1xx：服务端已经成功接收到你的请求，正在处理 你可以继续提交其他数据
2xx：服务端成功相应了数据（200）
3xx：重定向 (跳转连接)
4xx：（404请求资源不存在）（403你当前不符合某一些条件 无法正常访问）
5xx：服务器内部的错误
HTML：
超文本标记语言
文件的后缀名：
文件的后缀名是给人看的，对于计算机来说全部是二进制
之所以不同的后缀名有不同的功能，那是我们程序员自己认为的定制
注释是代码之母：
HTML的注释:
<!--单行注释-->
<!--
多行注释
多行注释
多行注释
-->
在搭建页面的时候通常会利用注释来划分区域
如
HTML的文当结构：
<html>
<head></head> 给游览器看的
<body></body> 内的代码才是给人看的
</html>
标签的分类一：
- 双标签（h1，a）
- 自闭合标签（img）
head内常用标签
title：定义页面标题
style： 内部支持写css
link：引入外部css样式
script：内部可以直接写js代码，也可以引入外部js文件
meta：定义网页源信息
body内部常用标签
h1~h6 ：标题标签
p：标签，一个p就是一行内容
s：删除线
b：加粗
i：斜体
u：下划线
br：换行
hr：一条分割线
body内部特殊符号
 ：空格
&：&
¥：￥
>：>
<：<
©: ©
®: ®
标签分类二：
块儿级标签：
独占一行：h1~h6，p，br，hr，div
- 块儿级标签内可以嵌套其他块儿级和内级标签
- 注意：p虽然是块儿级标签，但是她的内部不能嵌套任何块儿级标签，只能嵌套行内标签
内行标签：
内部文本多大，就占多大
行内不能嵌套行内和块儿级
标签通常应该有两个属性
id：类似于是一个身份证号，每个标签都应该有id值，并且在同一个html文当中，标签id不能重复
class：类属性，有点类似于面向对象的继承class=‘c1 c2’ 这标签就会用有这两个的所有样式
body内重要的标签
div：一块区域 你可以往这块区域内填写任何内容
span
div和span是前期构建网页的基本骨架
a 链接标签
-
跳转功能
href参数控制跳转的地址，这个地址果然在你的机器上如果么有点击过默认是蓝色的，点过则都是紫色的
-
锚点功能
给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
- 图片地址 网上地址也可以是本地图片地址
- url 自动朝该网址发送get请求，获取图片资源alt
alt
当图片加载不出来的时候 展示的提示信息
title
鼠标悬浮上去后展示的提示信息
width和height
只需要设置一个参数就行，等比例缩放
两个同时用会失真
列表标签
无序列表
ui
li
type参数:
disc(实心圆点，默认值)
circle（空心圆圈）
squra（实心方块）
none（无样式）
有序列表（了解）
ol
li
type参数：
1 数字列表，默认值
A 大写字母
a 小写字母
Ⅰ大写罗马
ⅰ小写罗马
标题列表(了解)
dl
dt 小标题
dd 小章节
表格标签
展示数据 一般都用到表格标签
<table>
<thead>
<tr>
<th>username</th>
<th>password</th>
<th>hobby</th>
<th>is_delete</th>
</tr> 一个tr就表示一行
</thead>
<tbody>
<tr>
<td>jason</td>
<td>123</td>
<td>study</td>
<td>0</td>
</tr>
</tbody>
</table>
