フロント
すべてのユーザーが直接取引とフロントエンドのインターフェースであることができます
1）ソフトウェア開発フレームワーク
のC / S構造
のB / Sアーキテクチャ：本質的には、C / Sアーキテクチャであります
2）ブラウザは、いくつかのことを送信するためにURLを入力してください？
1. URLを入力
サーバがリクエスト送信の方2.
サーバはバックブラウザたいブラウザへの要求やクエリデータを受信3.
データショーのページを取得する4.ブラウザを
3）HTTPプロトコル
ハイパーテキスト転送プロトコルの
データ交換が合意に従わなければならないクライアント・サーバ
4）電子機器、情報の伝達の識別特性：バイナリ ↓
HTTPプロトコルのみに従うこと。1. Webベースの送信は、一般的な構文解析を書くのは簡単でした
誰がそれを見るために最後2.ファイルの拡張子？ただ、ポスター
Webサービスの性質
インポートソケット SK = socket.socket（） sk.bind（（" 127.0.0.1 "、8080 ）） sk.listen（ 5 ） 一方、TRUE： CONN、ADDR = sk.accept（） データ = conn.recv（8096 ） CONN .send（B " HTTP / 1.1 200 OK \ rを\ nを\ r \ nの" ） conn.send（bは" <H1>こんにちは、世界！</ H1> " ） はconn.close（）
HTML入門
WenbenチャオBiaoji Yuyan Webページを作成するために使用するハイパーテキストマークアップ言語、
HTMLはプログラミング言語ではありません！！！これは、Webページを記述するためのタグを使用しています。
自然：ブラウザのルールは、ブラウザがルールに従ってWebページをレンダリング、ライティングウェブの規則に従って、認識されています。
異なるブラウザのために同じラベルの異なる解釈を有することができます。（互換性の問題）
ウェブページのファイル名の拡張子：.htmlを.htmのか
オープンhtmlファイル：
オプション1：ファイル選択ブラウザを見つけて開きます
実施例2：オート開pycharm
1）文書構造
<！DOCTYPE HTML > <！ - HTML5の文書として宣言は、HTML文書の最初の行でなければなりません- > < HTML LANG = "EN" > < 頭> <！ - ユーザーに保存されているヘッドのコンテンツを見ることができません、主にブラウザや検索エンジンへ- > < メタ文字コード= "UTF-8" > < タイトル>タイトル</ タイトル> </ ヘッド> < 身体> <！ - ユーザーは、体内のコンテンツを表示するには内部- > </ ボディ> </ HTML >
2）ラベル構文：
<タグ属性名= 1「属性値1」項目2 =「属性値2」......>コンテンツ部分</タグ名>
- ドキュメントの<HTML>、</ html>タグには、開始と終了タグです。ルートHTMLページの要素、文書の真ん中トップ（ヘッド）と、本体（ボディ）
- <HEAD>、</ HEAD>は、HTML文書の始まりを定義します。これは、文書の元（メタ）データが含まれています。
- <タイトル>、</タイトル>は、ページタイトルは、ブラウザのタイトルバーに表示されて定義されています。
- <BODY>、</ body>の間のテキストは、目に見えるページの本文の内容です。
- 注意：中国のウェブページの場合、それ以外の場合は文字化けします、<メタ文字セット=「UTF-8」>ステートメントを使用する必要があります。
- デフォルトのエンコードGBKに設定し、一部のブラウザでは、あなたは<メタ文字セット=「GBK」>を設定する必要があります。
- <！DOCTYPE>宣言は、HTMLタグではなく、ページのHTMLバージョンを使用して、Webブラウザが命令を書くことがどの程度の指標であります
3）いくつかの非常に重要な特性：
- ID：固有のID定義されているタグ、独自のHTMLドキュメントツリー
- クラス：html要素（クラス名）（CSSスタイルクラス名）のための1つまたは複数のクラス名を定義します
- スタイル：指定された要素のインラインスタイル（CSSスタイル）
一般的なHTMLタグ
内で使用される<HEAD> </ HEAD>タグ
<タイトル> </タイトル>ページタイトル
書かれた<スタイル> </スタイル> CSSコード
<スクリプト>直接内部の</ SCRIPT> JSコード書き込み、外部コード・ファイルのsrc属性JSでも導入することができます
外部ファイルCSSを導入することにより、<リンク/>のhref
<META />元のページの情報を定義します
<body></body>内常用标签
1）基本标签
<p>段落标签</p> <h1>标题1</h1> <!--最大号--> <h2>标题2</h2> <h3>标题3</h3> <h4>标题4</h4> <h5>标题5</h5> <h6>标题6</h6> <!--最小号--> <b>加粗</b> <i>斜体</i> <u>下划线</u> <s>删除</s> <!--换行--> <br> <!--水平线--><hr>
2）特殊字符
空格 & & < < > > ¥ ￥ © © 版权 ® ® 注册
3）常用标签 * * * * * *
<div></div> <!--用来定义一个块级元素，另起一行--> <span></span> <!--用来定义一个行内元素--> <p></p> <!--p标签：不能包含块级标签，也不能包含p标签--> <a href=""></a> <!--超链接标签--> <img src="" alt=""> <!--图片标签-->
4）列表标签
<ul type=""> <!--无序列表--> <li>a</li> </ul> <ol type=""> <!--有序列表--> <li>111</li> </ol> <dl> <!--标题列表--> <dt>标题</dt> <dd>内容</dd> </dl>
5）表格标签
固定就以下面的格式书写
<table>
<thead></thead>
<tbody></tbody>
</table>
tr 一个tr表示一行
rowspan 垂直方向合并
colspan 水平方向合并
border 调整列表的边框
cellspacing 调单元格与外边框之间的距离
cellpadding 调文本与单元格之间的距离
<table border="1" cellspacing="20" cellpadding="10"> <!--表单标签--> <thead> <tr> <!--一行--> <th>name</th> <th>age</th> <th>hobby</th> </tr> </thead> <tbody> <tr> <td colspan="2">json</td> <!--横向方向占两格--> <!--<td>18</td>--> <td rowspan="2">read</td> <!--竖直方向占两格--> </tr> <tr> <td>nick</td> <td>18 </td> <!--<td>run</td>--> </tr> </tbody> <tefooter></tefooter> </table>
6）form表单：前后端数据交互 * * * * * *
获取用户输入(手动输入/选择/默认值)，并将获取到的用户信息发送给后端
form表单中只有input的type类型为submit才会触发提交信息的动作
如果不想通过input标签来触发提交动作 那么可以直接写一个<button>button按钮</button>
input
通过控制type的类型从而实现不同的获取用户输入的标签样式
text 普通文本
password 密文
date 日历
radio 单选框
checkbox 多选框
file 获取文件
submit 触发提交数据的行为
button 普通的按钮
reset 重置form表单内容
select
选择框 默认是单选的 可以通过multiple参数将单选变为多选
一个option就是一个选项
textarea
获取用户大段文本值
form表单中几个重要的属性
action:用来控制数据到底提交给谁 写url来指定提交给谁
form表单默认是get请求 可以通过method属性修改提交方法
form表单中需要给每一个获取用户输入的标签加上name属性用来标识当前数据的类型
你可以将name属性当做字典的key 用户输入的当做字典的value 并且你可以手动设置value值
form表单发送文件 需要修改enctype属性的值
默认是urlencoded不支持传输文件
需要将其修改为multipart/form-data
GET请求与POST请求
get请求:获取想要的数据
post请求:提交数据
1、标签分类1
双标签：h1~h6、p、a
自闭和标签：img、br、hr
2、标签分类2
块儿级标签：div、 h1~h6、 p、 br、 hr
1.独占一行
2.块儿级标签：能够嵌套块儿级标签和行内标签
3.p标签虽然是块儿级标签，但是它不能嵌套任何的块儿级标签
4.块儿级标签能够设置长宽
行内标签：span、 img、a、i、 s 、b、 u
1.自身内容有多的就占多大
2.行内标签不能设置长宽
3、常用标签
所有的html标签都应该有一个id属性，用来唯一标识当前标签 为后续的DOM操作提供基础
也就意味着同一份html中标签的id不能重复，不写id属性也是可以的
a 标签：
可以通过href跳转到指定的网址
锚点功能:回到顶部
<a href="" id="a1">top</a>
<a href="#a1">bottom</a>
ps：target属性用来控制是否在当前页面跳转
默认是_self当前页
也可以指定成_blank新建页面跳转
img标签
src图片路径:即可以是网络上的图片地址也可以是本地的图片地址
alt当图片加载失败之后自动展示的提示信息
title鼠标悬停在图片上时显示的文本
图片调节长宽的时候只需要调节一个 另外一个参数自动等比例缩放
4、URL
统一资源定位符 Uniform Resource Locator，也称 网页地址，是因特网上标准的资源的地址
URL举例：
http://www.sohu.com/stu/intro.html
http://222.172.123.33/stu/intro.html
URL地址由4部分组成，各部分之间用“/”符号隔开。
第1部分：协议：http://、ftp://等
第2部分：站点地址：可以是域名或IP地址
第3部分：页面在站点中的目录：stu
第4部分：页面名称，例如 index.html