web小結~2019.3.24
阿新 • • 發佈：2019-03-24
輸入 通過 系統 頁面 world val 李白 select 等等
網頁文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>網頁文件</title>
</head>
<body>
<h1>2019.3..24對之前學的web進行復習</h1>
</body>
</html>
網頁文件：
瀏覽器中看到的網頁實質為：網頁文件
網頁文件：
擴展名為.html或.htm
文件內容為HTML代碼和文本內容
HTML簡介：超文本標記語言
HTML不是一種編程語言，而是一種標記語言。標記語言是一套標記語言。標記語言是一套標簽
，HTML 使用標簽來描述網頁
HTML語言三要素：
詞匯（標簽）、語法（標簽的使用規定）、語義（瀏覽器“理解”的標簽的含義）
HTML標記標簽通常被當成HTML標簽，它是由尖括號包圍的關鍵詞，如<html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<h1>你好！</h1>
</body>
</html>
<meta/> 定義頁面有關信息，如頁面編碼、關鍵詞、頁面描述
單標簽，必須在head標簽內、利用屬性值進行設置
標簽分類：
雙標簽：由“開始標簽“和”結束標簽”兩部分組分組成。結束標簽比開始標簽
多了一個“/”，必須成對使用
單標簽：在開始標簽中進行關閉，即以開始標簽的結束而結束（比如<meta/>）
為什麽HTML語言設計出單雙兩種標簽：
雙標簽：代表標簽作用範圍
單標簽：無需表達範圍，僅在標簽出現有效
標簽與標簽之間可以是嵌套的，但先後書序必須保持一致
HTML標簽對大小寫不敏感，但建議同一規範小寫
<body>標簽的額可選屬性
bgcolor 顏色名稱 規定文檔的背景顏色
text 顏色名稱 規定文檔中所有文本的顏色
標題標簽
<h1></h1> h1~h6
段落標簽：
段落——網頁中顯示一段文字
<p>.....</p>
圖片標簽——網頁中顯示一張圖片
<img src="" alt=“”/>
src:指明存儲圖像的位置
alt:為圖片添加替換文本
絕對路徑：
本機絕對路徑：從盤符開始的完整路徑
網絡絕對路徑：網絡可訪問地址
相對路徑：
先對路徑是指先對當前文件或目錄的路徑
先對路徑規則：
1、圖片和網頁在同級目錄 src="./圖片名"
2、圖片在網頁的下一級目錄 Src="目錄名稱/圖片名"
3、圖片在網頁的上一級目錄 src="../圖片名"
優點：文件夾被移動，其內部文件的相對路徑不變
註意事項：
1、不要使用本機絕對路徑，推薦使用相對路徑
2、圖片文件單獨存放在一個文件夾中
3、圖片文件夾與頁面文件放在同一個目錄下
超鏈接
超鏈接——從一個網頁指向一個目標的而連接關系
<a href="鏈接目標">鏈接對象</a>
屬性：
href:規定鏈接目標
target:在何處打開目標
_blank:在新窗口打開
_self:在當前窗口打開（默認）
列表
無序列表：是一個沒有前後順序的信息列表
有序列表：是一個有前後順序的信息列表
無序列表
無序列表使用<ul>標簽，每個列表使用<li>標簽
列表項內部可以使用段落、換行符、圖片、鏈接以及其他列表等
有序列表
有序列表使用<ol>標簽。每個列表項使用<li>標簽
列表項內部可以使用段落、換行符、圖片、鏈接以及其他列表等
表格
表格代碼：
、、
<body>
<table border="1">
<tr>
<th>姓名</th>
<th>年齡</th>
<th>成績</th>
</tr>
<tr>
<td>李思</td>
<td>21</td>
<td>100</td>
</tr>
<tr>
<td>李思白</td>
<td>20</td>
<td>100</td>
</tr>
<tr>
<td>李白</td>
<td>10</td>
<td>59</td>
</tr>
</table>
</body>
<th></th> ?
語法：
1. 成對出現
2. 嵌套於<tr></tr>標簽內 ?
語義：定義“表頭”（特殊的單元格） ?
<td></td> ?
語法：
1. 成對出現
2. 嵌套於<tr></tr>標簽內 ?
語義：定義表格中的“一個單元格
表格相關的屬性：
border:表格表框的額寬度（pixels）
bordercolor:表格邊框的顏色
background:表格背景圖
bgcolor:表格背景顏色
cellpadding:單元便沿與其內容之間的距離
cellspacing:單元格之間的空白
width:規定表格元素的寬度（pixels或%）
height：規定表格元素的額高度（pixels或%）
align:表格的對齊方式（left center right）
單元格合並
——跨列
rowspan="幾列"
——跨行
border="幾行"
表單
表單是一個包含表單元素的區域。表單元素是允許用戶在表單中輸入信息的元素（文本框、
下拉列表、單選框、復選框等等）；其作用是從訪問網站的而用戶哪裏獲得信息，是用戶
向服務器除數數據接口
表單標簽
<form></form>
語法：1、成對出現
2、表單的開始和結束位置
語義：定義一個表單
相關屬性：
action:規定向何處發送提交表單數據。
method:規定以何種方式將表單數據傳送ado服務器
所有表單控件都必須放到<form></form>標簽之間，
否則用戶輸入的信息無法提交到服務器
文本框
當用戶要在表單中鍵入字母、數字的內容時，就會用到文本框
<form>
<input type="text" name="名稱" value="文本"/>
</form>
1、type：當type=“text”，輸入框為文本輸入框
2、name:為輸入框命名，以備後臺程序使用
3、value：為輸入框設置默認值。（一般起到提示作用）
密碼框
<input type="password" name="名稱" value="文本"/>
選擇框
單選框：radio
<form>
<input type="radio" value="Male" name="sex" checked/>男
<input type="radio" value="Female" name="sex">女
</form>
復選框：checkbox (同組復選框name屬性值需要一致)
2、value：提交數據到服務器的值
3、name=為控件命名
4、checked:當添加checked時，該選項默認選中
文件控件：
當type屬性值為file時，用於文件上傳
<form>
<input type="file" name="files"/>
</form>
按鈕
提交按鈕：type="submit" 提交表單到服務器
重置按鈕：type="reset" 重置表單信息至初始狀態
普通按鈕：type="button"
多行文本域
<textarea></textarea>
相關屬性：
rows:規定文本區內可見行數
cols:規定文本區內可見列數
<form>
<textarea name="cat" rows="3" cols="3">
</textarea>
</form>
<select>標簽
下拉列表
標簽：<select></select>
列表項：<option></option>
<form>
<select name="class">
<option value="one" selected>軟件一班</option>
<option value="two" selected>軟件二班</option>
</select>
</form>
web簡介：萬維網（world wide web）是一個有相互連接的超文本組成的系統，通過互聯網訪問
URL（uniform resource locator 統一資源定位符）
組成部分：協議、服務期地址（域名）、資源路徑
網絡應用程序框架：
B/S框架（browser/server）
通過瀏覽器訪問網絡程序
C/S架構(browser/server)
通過客戶端應用軟件訪問網路程序
互聯網的發展：
信息共享、信息共建、隨時在線、物聯網（互聯網+）
網頁瀏覽過程：
1、通過輸入網址（URL）指定要訪問的網頁
2、請求：把XXX網頁文件傳送給我
3、響應：把XXX網頁文件傳送給你
網頁文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>網頁文件</title>
</head>
<body>
<h1>2019.3..24對之前學的web進行復習</h1>
</body>
</html>
網頁文件：
瀏覽器中看到的網頁實質為：網頁文件
網頁文件：
擴展名為.html或.htm
文件內容為HTML代碼和文本內容
HTML簡介：超文本標記語言
HTML不是一種編程語言，而是一種標記語言。標記語言是一套標記語言。標記語言是一套標簽
，HTML 使用標簽來描述網頁
HTML語言三要素：
詞匯（標簽）、語法（標簽的使用規定）、語義（瀏覽器“理解”的標簽的含義）
HTML標記標簽通常被當成HTML標簽，它是由尖括號包圍的關鍵詞，如<html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<h1>你好！</h1>
</body>
</html>
<meta/> 定義頁面有關信息，如頁面編碼、關鍵詞、頁面描述
單標簽，必須在head標簽內、利用屬性值進行設置
標簽分類：
雙標簽：由“開始標簽“和”結束標簽”兩部分組分組成。結束標簽比開始標簽
多了一個“/”，必須成對使用
單標簽：在開始標簽中進行關閉，即以開始標簽的結束而結束（比如<meta/>）
為什麽HTML語言設計出單雙兩種標簽：
雙標簽：代表標簽作用範圍
單標簽：無需表達範圍，僅在標簽出現有效
標簽與標簽之間可以是嵌套的，但先後書序必須保持一致
HTML標簽對大小寫不敏感，但建議同一規範小寫
<body>標簽的額可選屬性
bgcolor 顏色名稱 規定文檔的背景顏色
text 顏色名稱 規定文檔中所有文本的顏色
標題標簽
<h1></h1> h1~h6
段落標簽：
段落——網頁中顯示一段文字
<p>.....</p>
圖片標簽——網頁中顯示一張圖片
<img src="" alt=“”/>
src:指明存儲圖像的位置
alt:為圖片添加替換文本
絕對路徑：
本機絕對路徑：從盤符開始的完整路徑
網絡絕對路徑：網絡可訪問地址
相對路徑：
先對路徑是指先對當前文件或目錄的路徑
先對路徑規則：
1、圖片和網頁在同級目錄 src="./圖片名"
2、圖片在網頁的下一級目錄 Src="目錄名稱/圖片名"
3、圖片在網頁的上一級目錄 src="../圖片名"
優點：文件夾被移動，其內部文件的相對路徑不變
註意事項：
1、不要使用本機絕對路徑，推薦使用相對路徑
2、圖片文件單獨存放在一個文件夾中
3、圖片文件夾與頁面文件放在同一個目錄下
超鏈接
超鏈接——從一個網頁指向一個目標的而連接關系
<a href="鏈接目標">鏈接對象</a>
屬性：
href:規定鏈接目標
target:在何處打開目標
_blank:在新窗口打開
_self:在當前窗口打開（默認）
列表
無序列表：是一個沒有前後順序的信息列表
有序列表：是一個有前後順序的信息列表
無序列表
無序列表使用<ul>標簽，每個列表使用<li>標簽
列表項內部可以使用段落、換行符、圖片、鏈接以及其他列表等
有序列表
有序列表使用<ol>標簽。每個列表項使用<li>標簽
列表項內部可以使用段落、換行符、圖片、鏈接以及其他列表等
表格
表格代碼：
、、
<body>
<table border="1">
<tr>
<th>姓名</th>
<th>年齡</th>
<th>成績</th>
</tr>
<tr>
<td>李思</td>
<td>21</td>
<td>100</td>
</tr>
<tr>
<td>李思白</td>
<td>20</td>
<td>100</td>
</tr>
<tr>
<td>李白</td>
<td>10</td>
<td>59</td>
</tr>
</table>
</body>
<th></th> ?
語法：
1. 成對出現
2. 嵌套於<tr></tr>標簽內 ?
語義：定義“表頭”（特殊的單元格） ?
<td></td> ?
語法：
1. 成對出現
2. 嵌套於<tr></tr>標簽內 ?
語義：定義表格中的“一個單元格
表格相關的屬性：
border:表格表框的額寬度（pixels）
bordercolor:表格邊框的顏色
background:表格背景圖
bgcolor:表格背景顏色
cellpadding:單元便沿與其內容之間的距離
cellspacing:單元格之間的空白
width:規定表格元素的寬度（pixels或%）
height：規定表格元素的額高度（pixels或%）
align:表格的對齊方式（left center right）
單元格合並
——跨列
rowspan="幾列"
——跨行
border="幾行"
表單
表單是一個包含表單元素的區域。表單元素是允許用戶在表單中輸入信息的元素（文本框、
下拉列表、單選框、復選框等等）；其作用是從訪問網站的而用戶哪裏獲得信息，是用戶
向服務器除數數據接口
表單標簽
<form></form>
語法：1、成對出現
2、表單的開始和結束位置
語義：定義一個表單
相關屬性：
action:規定向何處發送提交表單數據。
method:規定以何種方式將表單數據傳送ado服務器
所有表單控件都必須放到<form></form>標簽之間，
否則用戶輸入的信息無法提交到服務器
文本框
當用戶要在表單中鍵入字母、數字的內容時，就會用到文本框
<form>
<input type="text" name="名稱" value="文本"/>
</form>
1、type：當type=“text”，輸入框為文本輸入框
2、name:為輸入框命名，以備後臺程序使用
3、value：為輸入框設置默認值。（一般起到提示作用）
密碼框
<input type="password" name="名稱" value="文本"/>
選擇框
單選框：radio
<form>
<input type="radio" value="Male" name="sex" checked/>男
<input type="radio" value="Female" name="sex">女
</form>
復選框：checkbox (同組復選框name屬性值需要一致)
2、value：提交數據到服務器的值
3、name=為控件命名
4、checked:當添加checked時，該選項默認選中
文件控件：
當type屬性值為file時，用於文件上傳
<form>
<input type="file" name="files"/>
</form>
按鈕
提交按鈕：type="submit" 提交表單到服務器
重置按鈕：type="reset" 重置表單信息至初始狀態
普通按鈕：type="button"
多行文本域
<textarea></textarea>
相關屬性：
rows:規定文本區內可見行數
cols:規定文本區內可見列數
<form>
<textarea name="cat" rows="3" cols="3">
</textarea>
</form>
<select>標簽
下拉列表
標簽：<select></select>
列表項：<option></option>
<form>
<select name="class">
<option value="one" selected>軟件一班</option>
<option value="two" selected>軟件二班</option>
</select>
</form>
web小結~2019.3.24