Python教程

4.22python笔记

本文主要是介绍4.22python笔记，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

HTML

前端学习路径

#知识脉络：
HTML、CSS、JavaScript、jQuery（框架）、Bootstrap（框架）
前端三剑客：HTML、CSS、JavaScript（目前学习内容）

#类比说明：
HTML：网页的骨架
CSS：网页的样式
JavaScript：网页的动态效果

HTTP简介

 	HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。

HTTP协议

	HTTP协议（Hyper Text Transfer Protocol，超文本传输协议，即传输文字、图片、音频、视频等超文本数据）是一种用于分布式、协作式和超媒体信息系统的应用层协议。为了更快地处理大量事务，确保协议的可伸缩性，HTTP协议被设计成了一种无状态协议，不保留之前一切的请求或响应报文的信息。HTTP协议也是万维网（WWW，World Wide Web）的数据通信的基础。

HTTP协议的四大特性

#基于请求、响应
	服务端永远不会主动给客户端发消息，必须是客户端先请求服务端被动响应
#基于TCP/IP作用于应用层之上的协议
	应用层协议：HTTP、HTTPS、FTP...
#无状态
	服务端不保存客户端状态（纵使见她千百遍，仍然当她如初见）
#短链接
	不保持客户端于服务端之间的链接导通
	补充：websocket（长连接），主要用于加好友聊天等业务

数据格式

请求格式：
即客户端给服务端发送消息应该遵循的数据格式

（1）请求首行（请求方法，协议版本）

（2）请求头（一大堆k：v键值对）

（3）换行，不能省略

（4）请求体（携带敏感数据：密码、身份证号...），不是一致都有
"""
b'GET / HTTP/1.1\r\n  请求首行
Host: 127.0.0.1:8080\r\n  请求头
Connection: keep-alive\r\n
Cache-Control: max-age=0\r\n
sec-ch-ua: " Not A;Brand";v="99", "Chromium";v="100", "Google Chrome";v="100"\r\n
sec-ch-ua-mobile: ?0\r\n
sec-ch-ua-platform: "macOS"\r\n
Upgrade-Insecure-Requests: 1\r\n
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/100.0.4896.127 Safari/537.36\r\n
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9\r\n
Sec-Fetch-Site: none\r\n
Sec-Fetch-Mode: navigate\r\n
Sec-Fetch-User: ?1\r\n
Sec-Fetch-Dest: document\r\n
Accept-Encoding: gzip, deflate, br\r\n
Accept-Language: zh-CN,zh;q=0.9\r\n
\r\n 换行
请求体
'
"""

响应格式：

即服务端给客户发消息应该遵循的数据格式

（1）响应首行（响应状态码，协议版本）
（2）响应头（一大堆k：v键值对）
（3）换行，不能省略
（4）响应体（给浏览器展示给用户看的页面内容）

响应状态码

1XX: 服务端成功接收到了你的数据正在处理 你可以等待或者继续发送
2XX: 200 OK  表示请求成功 服务端给出了响应
3XX: 301\302 表示重定向(想访问A页面但是自动跳转到了B页面)
4XX: 403请求不合法(权限不够)	404请求资源不存在
5XX: 都是服务端错误  与客户端无关(代码bug、机房炸了...)

HTML文档结构

<html>
<head>给浏览器看的数据</head>
<body>给用户看的数据</body>
</html>

id和class

HTML作为文本标记语言，定义了标签，或者称为元素，而id和class是其全局属性中的两个：
  id：顾名思义，元素的唯一标识id，页面中不应有重复
  class：元素的类名称（可以通过元素的classname来访问它

HTML标签

 1.标签的格式:
      <标签名>封装的数据</标签名>

    2.标签名大小写不敏感。（不区分大小写）

    3.标签拥有自己的属性。
      分为基本属性：bgcolor=“red” 可以修改简单的样式效果
      事件属性： οnclick=“alert(‘你好！’);” 可以直接设置事件响应后的代码。

    4.标签又分为，单标签和双标签。
      单标签格式： <标签名/> 如：<br/> 换行,<hr/> 水平线
      双标签格式: <标签名> …封装的数据…</标签名>

    5标签的语法：
      双标签一定要结束
      标签不能交叉嵌套
      属性必须有值，属性值必须加引号
      注释不能嵌套

中的常用标签

head标签内编写的标签一般都是给浏览器看的
  title标签			控制网页小标题
  style标签			内部支持编写css代码
  link标签			引入外部css文件
  script标签		        内部支持编写js代码 也可以通过src属性引入外部js文件
  meta标签			功能非常多
  				keywords:搜索引擎查询关键字
    				description:用于展示页面搜索结果的文本描述
"""
正常的业务逻辑 HTML CSS JS都会分不同的文件存储 用于解耦合
"""

HTML常用标签

# 1.标题系列: h1~h6(1到6级标题)
 	<h1>一级标题</h1>
    <h2>二级标题</h2>
    <h3>三级标题</h3>
    <h4>四级标题</h4>
    <h5>五级标题</h5>
    <h6>六级标题</h6>
# 2.字体系列
    <i>斜体</i>
    <b>加粗</b>
    <u>下划线</u>
    <s>删除线</s>
# 3.文本段落： <p></p>
	<p>何处望神州 满眼风光北固楼</p>
    
# 4.其他
	hr	水平分割线
	br	换行符

body内特殊符号（html）

&nbsp;		空格
&gt;		大于号
&lt;		小于号
&amp;		&符号(and)
&yen;		羊角符(￥)
&copy;		版权	
&reg;		商标(®)

HTML 段落标签(p)

 	<p>我是第一段</p>
    <p>我是第二段</p>

HTML 超链接（链接）标签(a)

超链接可以是一个字，一个词，或者一组词，也可以是一幅图像，您可以点击这些内容来跳转到新的文档
或者当前文档中的某个部分。
    <a>标签是超链接</a>
    href 属性设置连接的地址
    target 属性设置哪个目标进行跳转
      _self 表示当前页面(默认值)
      _blank 表示打开新页面来进行跳转

HTML列表标签

HTML 支持有序、无序和定义列表，常用的为前两者。
    1.无序列表
    		<ul>
    			<li></li>
    			<li></li>
    			<li></li>
    		</ul>
    <ul type="xxx">
    type 属性可以修改列表项<li>前面的符号：
      circle 空心圆
      disc 实心圆
      square 实心方块
      none 无符号
    我们可以使用快捷方式创建ul>li*n(n为你想要创建li的个数)，然后我们按下TAB键即可。


    2.有序列表
                    <ol>
    			<li></li>
    			<li></li>
    			<li></li>
    		    </ol>
    <ol type="xxx">
    type 属性可以修改列表项前序号的样式
      1 默认的样式 (1,2,3,4,5....)
      a 改为（a,b,c,d,e,f....）
      A 改为（A,B,C,D,E,F.....）
      i 改为(i,ii,iii,iv....)
      I 改为（I,II,III,IV....）
    我们可以使用快捷方式创建ol>li*n(n为你想要创建li的个数)，然后我们按下TAB键即可。

HTML 图像标签

<img />标签可以在html 页面上显示图片。
src 属性可以设置图片的路径 <img src="url" />
width 属性设置图片的宽度
height 属性设置图片的高度
border 属性设置图片边框大小
title  鼠标悬浮自动展示提示信息
alt 属性设置当指定路径找不到图片时,用来代替显示的文本内容<img src="boat.gif" alt="Big Boat">

HTML表格标签

<table>  <!--表格关键字字段-->

    <thead>  <!--表头字段-->
        <tr>  <!--tr表示一行-->
            <th>编号</th>  <!--th加粗文本-->
            <th>姓名</th>
            <th>年龄</th>
        </tr>
    </thead>  
    
    <tbody>  <!--表单数据-->
        <tr>
            <td>1</td>  <!--td普通文本-->
            <td>jason</td>
            <td>18</td>
        </tr>
        <tr>
            <td>2</td>
            <td>tony</td>
            <td>28</td>
        </tr>
        <tr>
            <td>3</td>
            <td>kevin</td>
            <td>38</td>
        </tr>
    </tbody> 
</table>
这篇关于4.22python笔记的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航