2 結構標記
3 表單
3.2 元素
3.3 其他控制項
4 h5新表單元素
預設按照從上到下的順序顯示資料,可以在資料前新增標識;
使用列表布局(去掉標識)
列表是將具有相似特徵或者具有先後順序的幾行文字進行對齊排列;
所有列表都由列表型別和列表項組成:
列表型別:有序列表order list 和無序列表unorder list
列表項:指示具體列表型別list
**混排
按從上到下,或者從左到右的順序顯示所有資料,可以在資料前新增識別符號號
元素表示有序列表,用於列出頁面上有特定次序的專案
元素只能包含列表項元素
屬性:type指定標識項型別:1數字(預設),a小寫字母,a大寫字母,i小寫羅馬數字,i大寫羅馬數字
start指定起始編號
無序列表
元素表示無序列表,用於列出頁面上沒有特定次序的專案;
元素只能包含列表項元素;
屬性:type指定標識項型別:disc實心圓(預設),circle空心圓,square實心菱形,none不顯示標識
列表巢狀
巢狀使用可以建立多層列表,常用於建立文件大綱和導航選單等;
語義上規定下一級ul必須寫在外層ul>li中,否則會影響後續css的定義
定義列表
用於給出一類事物定義情形
標記定義乙個定義列表;
標記定義了定義列表中的術語;
標記定義列表中的術語提供定義
要解釋的名詞
具體解釋
如果使用元素設計頁面的大致布局,當布局複雜時會出現大量元素,相互巢狀會導致難以處理和維護頁面;
html5提供結構標記專門用於標識常見結構,可以很方便地實現頁面各部分劃分,是的文件結構清晰明確,容易閱讀;
元素
標籤,用於定義文件的頁首;可以多次出現,為任何部分的頭部定義;
元素元素定義頁面導航鏈結部分,用於包含表示鏈結的其他元素元素定義頁面導航鏈結部分,用於包含表示鏈結的其他元素
元素標籤用於定義文件中的節,表示文件中乙個具體組成部分;常用於為頁面上內容分塊;可以使用元素為內容新增標題
元素元素常用於定義頁面的額外組成部分
3.1.1 表單作用
表單用於顯示、收集資訊並提交至伺服器;
表單有兩個基本部分:
1.提供視覺化的輸入控制項;
2.收集使用者資訊並提交給伺服器;
前端:提供表單控制項,與使用者做互動的視覺化控制項;
後端:對提交資料進行處理(介面)
使用get是預設值,明文提交(通過url位址傳遞),資料傳遞有大小限制2kb,安全性較低,常用於向伺服器獲取資料;
post隱式提交資料無大小限制,不通過url傳遞,常用於提交資料到伺服器,引數放在請求主體form data中,安全性較高;
delete
put
3)enctype:表單資料進行編碼的方式;
設定表單允許提交的資料
提交普通字元,不能帶有特殊符號;enctype=「text/plain」
允許將檔案提交給伺服器;enctype=「multipart/form-data」
4)name:表單名稱
3.1.3 表單控制項
表單可以包含很多不同型別的表單控制項;
表單控制項元素是包含在表單元素中具有視覺化外觀的html元素,用於訪問者輸入資訊;
input元素:文字輸入控制項、按鈕、單複選按鈕、選項框、檔案選擇框和隱藏控制項
textarea元素
select 和option元素
其他元素
元素用於收集使用者資訊;單標記,
主要屬性:
type:根據不同type屬性值建立各種型別輸入字段
value:控制項的資料
name:控制項的名稱
disabled:禁用控制項,無值屬性
文字框與密碼框
文字框密碼框
主要屬性:
name名稱、value訪問者自由輸入的任何文字;
maxlength限制輸入的字元數;
readonly設定文字控制項唯讀,無值屬性,允許資料提交;
placeholder 佔位符,預設顯示在控制項上的文字,得到焦點即無效
單選框和核取方塊
單選框:
核取方塊:
主要屬性:
name設定名稱,用於分組,同組框的名稱必須相同
value:當提交form時,如果選中,該value被傳送到伺服器;不設定value將傳遞on
checked:設定預設被選中,無值屬性
核取方塊屬性name需要設定為陣列形式才能接受多個資料按鈕
按鈕submit:提交按鈕,傳送表單資料給伺服器端或其他程式處理
reset:重置按鈕,清空表單內容,設定為預設值;
button:無功能按鈕,屬性onclick呼叫js指令碼;
主要屬性:name名稱、value文字
h5定義同時具備submit和button的特點隱藏域
隱藏域:在表單中包含不希望使用者看見的資訊
主要屬性:name名稱、value值;
檔案選擇框
檔案選擇框:
主要屬性:name名稱
注意:method=「post」 , enctype=「multipart/form-data」, 無值屬性multiple設定多個檔案上傳,name屬性也要設定為陣列型別
元素語法:
for表示與label相聯絡的控制項的id值,將文字與控制項聯絡在一起,單擊文字,效果等同單擊按鍵
文字選項框
下拉選項框和滾動列表
建立選項框
name:選項框命名;
size:定義顯示選項的數量,預設為1,大於1則為滾動列表;
multiple:設定多選,忽略size屬性成為滾動列表,屬性name需要改為陣列儲存;
:選項value:選項的值;
selected:預選中;
當option沒有value屬性,select的value為option的內容;當option有value屬性,select的value為option的value
\
主要屬性:
name:名稱;cols:指定文字區域的列數,以英文本母為準;rows:指定文字區域的行數;readonly:唯讀
由於列數實際應用中不準確,故專案中很少使用
控制項分組
:為控制項分組
:分組標題
浮動框架元素
在乙個瀏覽器視窗同時顯示多個網頁;
元素,設定屬性src指向其他頁面的url;
src網頁url,height/width用百分比和px調整,新增的文字內容將在瀏覽器不支援該元素時顯示,frameborder=「0」,scrolling=「no」
用處:可以將網頁固定不變的部分單獨提取出html檔案,在其他網頁中用iframe重用;但是需要用js.dom計算視窗高度
搜尋型別
輸入搜尋關鍵字操作的文字框:
快速清除文字框
url型別
驗證資料是否符合url絕對路徑規範< input type=「url」/>
驗證http://以及後面內容
**號碼型別
針對移動端輸入,能夠根據不同裝置進行調整彈出九宮格鍵盤:
數字型別
只能接受固定數字值:
屬性:min、max閾值,step決定域所接受值遞增或遞減的步長,預設為1,value="10"設定預設值
不成熟,比如value初始值可以小於閾值範圍型別
允許使用者選擇乙個範圍的數值:
value:初始值,step:步長
顏色型別
預定義的顏色拾取控制項:
日期型別
建立日期輸入域:
周型別與日期類似,但只能選擇周:
月份型別
與日期類似,但只能選擇月:
05HTML 列表 結構標記 表單
1.作用 按照一定的格式顯示資料 2.列表的分類 語法 2.1列表的組成 由列表型別以及列表項來組成 2.2分類 語法 unorder list 允許包含若干列表項 屬性ol屬性 1 type 1按數字方式排列,預設值 a按小寫英文方式排列 a按大寫英文方式排列 i按小寫羅馬數字排列 i按大寫羅馬數...
HTML筆記(三) 列表
1.無序ul標籤 html body h4 乙個無序列表 h4 ul li 咖啡 li li 茶 li li 牛奶 li ul body html 效果 值描述disc 預設值。實心圓。circle 空心圓。square 實心方塊。2.有序ol標籤 html body type i ol li 咖啡...
HTML學習03 列表
標籤用於定義有序列表,列表排序以數字來顯示,並且使用標籤來定義列表項。有序列表的基本語法格式如下 列表項1 列表項2 列表項3 標籤用於定義描述列表 或定義列表 該標籤會與 定義專案 名字 和 描述每乙個專案 名字 一起使用。自定義列表的基本語法格式如下 名詞1 名詞1解釋1 名詞1解釋2 名詞2 ...