一，目錄
1. HTML ： html就是一套瀏覽器認識的規則，主要用20個左右的標簽
對於開發者來說：學習html規則
1. 本地測試：（1）找到html文件，直接瀏覽器方式打開，不用socket；（2），pycharm可以直接打開html
2. 編寫html文件:
---doctype對應關系
---HTML 標簽<html>XXXXX</html>，內部可以添加屬性
---Lang="XXX",標簽內部屬性
3. 標簽分類：
---自閉和標簽 <meta charset="UTF-8"> 比較少
---主動閉合標簽 title>網頁名</title>
4. Head標簽：
---<meta ->編碼，跳轉，刷新，關鍵字，描述，IE兼容
---title標簽
--- <link /> 標簽圖標
---<style />
---<script>
7. <body>標簽：
---圖標， > <
---P標簽（段落），段落之間有間距
---Br標簽，用來換行
---<H>標簽， 設置字體大小
---<span> 行內標簽（區別於塊級標簽） 只能選擇字體范圍，不能選擇整行
---<div> 塊級標簽，用的最多。
---標簽之間可以嵌套；標簽存在的意義，可以用CSS,JS操作。
---input 系列 + form標簽
input type = "text" -name屬性； ‘value = XXX默認值
input type = ‘password’ -name屬性
input type = ‘submit’ - value=‘提交’ 提交按鈕
input type = ‘button’ -value=‘登錄’按鈕
input type = 'radio' -單選框value，name屬性（name屬性互斥）
input type = 'checkbox' -復選框 Value， name屬性，可以獲得列表
input type = 'file' 上傳文件，依賴form表單的屬性‘’
input type = ‘reset’ 重置
<textarea>默認值</textarea> 輸入比較多的內容
<select><option> 下拉框選擇 select = selected 默認選項；multiple = multiple可以多選；
8. a 標簽
---跳轉
---錨，就是點擊目錄可以跳轉； herf = ‘#某個標簽的ID’， 標簽的ID 不允許重復
9. img標簽：
---src
---alt
---title
10. list列表標簽：
---UL ==> LI 一個列表，前面都是點。
---OL ==> LI 一個列表，前面用數字排序
---DL ==DT,DD DT是上層目錄，dd是下層目錄
11. table表格標簽：
---tbody 表身
---thead 表頭
--- colspan = X，行合並X行； rowspan= X， 列合並X行
12. label 標簽 用於電子文字，是的關聯的標簽獲取光標
13. fieldset標簽： legend 在外圍添加一個方框；
14. <div>
15. <h>
16. <span>
開發后台程序：
1，寫HTML文件（充當模板的作用）
2， 去數據庫獲取數據然后替換到html的指定位置（web框架）
2. CSS ：顏色，位置之類的相關操作。。。
----標簽的style屬性
---寫在head里面，style標簽中寫樣式
----id選擇器，ID可以給標簽設置屬性
---class選擇器，選擇其他的標簽並class復制
---標簽選擇器： div{...}, 所有的div都會設置成此樣式；
---層級選擇器（空格）==》.c1,.c2 div{}
---組合選擇器（逗號） ==》 c1,.c2,div{}
---屬性選擇器： 對選着到的標簽通過屬性再進行一次篩選；
---css樣式可以單獨寫在css文件中，然后<link rel='stylesheet' herf= 'css樣式文件'>
3。 注釋 /* */
4. 邊框 ==》boarder: 1px solid color; 寬度，樣式，顏色
5. 背景
6.float 讓標簽漂浮，塊級標簽可以堆疊
7. display： display: inline 標簽都變成行內標簽;
display: block 塊級標簽；
display：inline-block，默認行內標簽屬性，但是可以設置；
displasy：none， 可以顯示可以關閉，類似視頻網站開燈關燈
行內標簽無法設置寬度和高度，padding，margin；塊級標簽可以設置；
8. padding， margin（0，auto），內邊距，外邊距
margin（0，auto）：代表div模塊頂邊處理，距離上下的邊距為0，左右是auto居中
9. text-align
10. height， width， line-height，color，font-size， font-weight（字體加粗），text-align 水平居中
11. position: 瀏覽器右下角的返回頂部按鈕：position：fixed 用來固定在頁面的某個位置。
position： absolute+relative ==》固定在某個div的里面的某個位置
12. overflow：hidden 超過范圍隱藏； overflow：auto 超過范圍會出線滾動條
13. Hover屬性： 當鼠標移到某個標簽上，這個標簽會發生反應， 例如： pg_header.menu: hover; background-color: blue;
14. background-image: url(‘image、gif’)；默認DIV比較大的話，圖片重復訪問
background-repeat：repeat-y/x 水平或垂直方向重復；no-repeat 就是不重復。
background-position： 可以控制圖片的位置； postion-X Y 水平，垂直位置
Javascript:
1. 存在的形式：
---在head中<script>
//javascript 代碼
<script>
---或者保存在文件中 <script src='js文件路徑'><script>
JS代碼塊需要放置在<body>標簽的最下面
2.變量
name=“112233” 默認是全局變量； var name="2223324" 局部變量
寫JS的時候，可以在html里面也，也可以在瀏覽器的console里面寫。
字符串： a.charAt(索引位置)；a.substring(起始位置，結束位置)； a.length:獲取當前長度
setInterval（'func()',1000）:每一秒鍾執行一次；
var tag = document.getElementById('if'):或者局部變量，結合上面幾個字符串和變量，可以讓變量動起來
3. Dom 操作： ---找到標簽 document.getElementById('ID')獲取單個元素
---document.getelementbytagname('div') 獲取多個元素
操作標簽： innerText： 獲取標簽中的文本內容
className：