Html中的表單的步驟和主要元素

2021-10-09 11:07:51 字數 2205 閱讀 9598

html檔案字尾為.html或者.htm,必須使用瀏覽器進行解析,

全文不區分大小寫,具有較高容錯性,瀏覽器中存在兩個引擎

乙個是標籤解析器,乙個是指令碼解析器,從上往下一行行的解析

解析成功渲染在瀏覽器中

瀏覽器從上往下解析,第一行就是dtd(document type definition

文件型別定義),這行dtd規定了全文使用何種版本的html,能夠使用

哪些標籤,這些標籤的出現次數等等

html最新版本為html5.0版本

此處就是html5.0,從5.0開始dtd不再發生大的變動,之前4.01

及前面的版本dtd書寫方式不同

html:根標籤,內部巢狀所有的標籤,注意html和xml都只有乙個

根標籤lang:後面設定本網頁的語言型別,en表示英文網頁

zh-cn表示中文網頁,如果網頁語言與當前作業系統設定的

語言不符,則谷歌翻譯會自動提示是否翻譯

限於谷歌無法使用,此功能無法使用

head:頭資訊

用來設定頁面的編碼,關鍵字,描述,引入

js css 等一切外來資源

meta:設定當前頁面的編碼

常用的編碼:

iso-8859-1:最早的編碼型別,不支援中文

utf-8:網際網路安全編碼,支援中文,國外使用較多,

大多數支援中文的開發工具都使用utf-8

gb2312:國標碼測試版,在iso-8859-1的基礎上修改

而來,有2000多個中文生僻字無法使用

gbk:國標碼,完全支援中文,國內很多**使用此編碼,

windows中國地區預設編碼

title:設定頁面的標題

body:表示頁面的正文,此標籤就是表示當前視窗

header:h5新增,此標籤表示頁首,多巢狀當前頁面的標題,搜尋框等

h1~h6:共有六級標題,隨著序號的不斷增大,字型不斷減小

hr:設定一條分割線

section:h5新增,此標籤用來設定頁面的主體資訊

form:表示表單的開始,放置在此標籤內元素一般稱之為

表單項,表單項可以以各種形式,收集使用者填寫的資訊,以鍵值對的

形式傳送到action設定的目的地,當表單提交時,使用者填寫的資訊

以鍵值對的方式提交到action設定後端

格式:action設定的位址?key=value&key2=value2&keyn=valuen

路徑書寫規範

./:表示當前目錄下尋找

…/:表示跳出當前目錄尋找

1)單行文字輸入框

type=「text」

name:鍵值對的鍵,此鍵值隨意書寫

隨意書寫不包含以下五種寫法

a:中文

b:-,橫線多用於ui中

c:空格

d:數字開頭

e:特殊字元

id:對應label中的for屬性

placeholder:當使用者不書寫內容時,顯示的提示文字

autocomplete:自動完成功能,為安全性考慮一般關閉

設定off

autofocus:自動獲取焦點,當開啟網頁時,游標就在元素內

value:鍵值對的值,一般不事先書寫

required:必須填寫

maxlength:最大長度

minlength:最小長度

2)單行文字密碼框

type=「password」

3)單選框

type=「radio」

checked:預設選中,值為true

4)核取方塊

type=「checkbox」

5)下拉列表框

6)上傳控制項

type=「file」

7)隱藏域

type=「hidden」

注意隱藏域一般用來在使用者毫不知情的前提下傳送鍵值對

頁面沒有任何顯示

郵箱,type=「email」

日期,type=「date」

預設格式 yyyy-mm-dd

手機號type=「tel」

需要搭配正規表示式 通過pattern屬性來進行書寫

提交按鈕

type=「submit」

取消按鈕

type=「reset」

注意按鈕不用來傳遞值,所以不書寫value值

直接使用value表示按鈕上的文字

footer:h5新增,此標籤用來設定頁面的頁尾

html提交表單中input image和img

1.此會自動對form表單進行提交,即為type submit 若提交前要進行判斷 檢驗則用 但是用這種方式提交會發生表單提交兩次的現象,經常會造成表單元素被重複提交,資料庫被寫入異常!尤其是用ie問題比較嚴重,用火狐的話還不會報錯!此時注意,要把資料庫設定為同一資訊要唯一!原因 html 中 im...

html5中的表單

1 form id aform action reg.php 2 p 請填寫表單內容以完成註冊!p 34 fieldset 5 legend legend 6 label for name 姓名 label 7 input id name placeholder ye feng autofocus ...

HTML新增的表單和屬性

html新增了如下例顯示的新表單,具體可參考 input表單新增了屬性 table 屬性 描述 placeholder require pattern 正規表示式校驗 autofocus 自動聚焦 form 將輸入表單與form的id聯絡起來,可以將輸入表單放在頁面的任何位置 list 與datal...