不同的標簽,有不同的屬性;也有一些通用屬性(在任何標簽內都能寫)屬性名、屬性值不能亂寫,都是W3C規定好的屬性名、屬性值,都不區分大小寫,但推薦小寫雙引號,也可以寫成單引號,甚至不寫,但推薦寫雙引號標簽中不要出現同名屬性,否則后寫的會失效,例如:<input type="text" type="password">
VSCode 刪除行快捷鍵:Ctrl+Shift+K
級版HTML視頻教程(全網原創首發?。?/p>
什么是HTML?HTML指的是超文本標記語言,它是從事網頁設計工作的基礎,也是網站開發者必須熟練掌握的一門標記語言。應廣大學員的強烈要求,我愛自學網特推出《HTML基礎教程》,希望能得到廣大學員的支持。
學習交流
標 題
第一課:HTML語言框架和相關標簽95 1-1 學習html的前提和必要性53662 1-2 什么是HTML33819 1-3 HTML語言的整體框架135783 1-4 HTML語言的整體框架231727 1-5 行標簽和段標簽29866 1-6 文字屬性標簽28853 1-7 文字格式化標簽26888 1-8 body標簽27570 1-9 標題標簽25212
第二課:常用標簽代碼0 2-1 圖片37992 2-2 超鏈接127213 2-3 超鏈接223253 2-4 iframe標簽25784 2-5 橫線22900 2-6 列表22740 2-7 無序列表20544 2-8 有序列表21073 2-9 滾動標簽23217 2-10 轉義字符22227
第三課:表格標簽83 3-1 表格31370 3-2 表格屬性123819 3-3 表格屬性223066
您說說看 我發明的...是不是很牛逼呀[滑稽]
總 高級版學習資料文件高達10G!??!
總 高級版學習高清視頻資料的高達35G!!!
需要的話我后期會更新,所以關注我,學到的好東西都是你自己的哦[滑稽]
那么大概內容就更新到這里
本教程后期會逐一更新高清視頻學習資料+超詳細的學習資料教程!
別忘了四連!!【點贊 收藏 關注 投幣】
我怕你到時候想找我都找不到了~[鮮花]
注:本人原創首發,未經允許禁止轉載/抄襲,如有違法,本人將有權追究法律責任!??!
表單的信息發送與處理過程可以簡單的進行圖示,如下圖。
以注冊會員為例,用戶在自己的電腦上打開相應的注冊表單頁面填寫信息,完成填寫后點擊提交按鈕,也就是圖中1所示過程。
這時瀏覽器會將這些信息發送給處理這些信息的服務器,服務器上有使用類似asp或php寫成的相應的處理程序,處理完成后,生成一個反饋信息,也就是2到3的過程。
然后服務器將處理后的信息發送給個人電腦,個人電腦在瀏覽器上通過一個新頁面來提示用戶處理結果。
這里就涉及到一個問題,一個網站會有針對不同用戶的信息注冊表單以及相應的信息處理程序,比如我們注冊頭條號就有"個人"、"企業"、"媒體"和"國家機構"的區分。如何使不同的表單找到相應的處理程序呢?在<form>標簽中,有一個action屬性就是為這個表單信息指定處理程序的。
<form>中的action屬性
調用程序
<form>的action屬性實際上就是為表單提示處理程序所在的路徑,如果程序和頁面在一個服務器中存儲,那使用相對路徑即可,如果在其他服務器,則要使用絕對路徑。示例代碼如下:
<form action="form_action.asp" method="get">
<p>First name: <input type="text" name="fname" /></p>
<p>Last name: <input type="text" name="lname" /></p>
<input type="submit" value="Submit" />
</form>
這段代碼中的"form_action.asp"程序和這個表單頁面在一個文件夾中,故直接寫名稱即可調用。
發送郵件
action屬性除了調用程序外,也可以發送郵件,示例代碼如下:
<form action="MAILTO:someone@w3school.com.cn" method="post" enctype="text/plain">
<h3>這個表單會把電子郵件發送到 W3School。</h3>
姓名:<br />
<input type="text" name="name" value="yourname" size="20"><br />
電郵:<br /><input type="text" name="mail" value="yourmail" size="20"><br />
內容:<br /><input type="text" name="comment" value="yourcomment" size="40"><br /><br />
<input type="submit" value="發送">
<input type="reset" value="重置">
</form>
這段代碼中。發送郵件的寫法是這樣的:action="MAILTO:someone@w3school.com.cn",通過MAILTO:告訴瀏覽器,這里要發送郵件!然后輸入相應的郵箱地址,這樣就會把表單中的信息以郵件的形式發送到相應的郵箱中了。
大家可以把郵箱地址改成自己的郵箱試一下,瀏覽器會讓大家選擇發送郵件的程序。如圖所示:
使用這個功能我們可以寫一個簡單的郵件發送頁面,示例代碼如下:
<form action="mailto:yourname@domain.com" method="post" enctype="text/plain">
主題:<input name="subject" type="text"><br>
抄送:<input name="cc" type="text"><br>
密送:<input name="bcc" type="text"><br>
正文:<textarea name="body"></textarea><br>
<input type="submit">
</form>
這樣的寫法大家可能會發現問題,即如果一個網站注冊用戶超過100人以后,靠這種手動輸入用戶郵箱的方法發送郵件簡直就是折磨人?。?/p>
實際上,在網站中,我們會把會員或注冊用戶的郵箱存在數據庫中,通過調用數據庫中的用戶郵箱的程序語句來替換action中的具體郵箱地址即可,再通過程序,可以針對全部用戶或部分用戶進行群發信息。
其中,enctype屬性是向服務器聲明上傳信息的形式,也就是向服務器說明發送的數據到底是數字還是英文還是中文還是編程語句。專業一些的說法是"規定在發送表單數據之前如何對其進行編碼。"
全部屬性值有三個,如圖所示,大家可以簡要理解一下。
除此之外,我們還發現一個屬性叫做method(方法),通過上面的示例代碼可知,method屬性有兩個屬性值,一個是get一個是post,這是什么意思呢?
信息上傳的兩種方法
<form>中的method標簽即為表單信息指定相應的發送方法。
方法有兩種,一種叫get,這種方法通常用來發送簡短的且低安全要求的信息,特點是速度比較快。
post經常用來發送體積較大的信息,如果發送一些對安全性要求高的信息,html的官方說明中建議使用post方法。
我個人認為,現階段大家能記住這兩個方法的主要特點即可。這一篇的內容實際上也是前端學習者對服務器端的運行的了解內容。
下面為大家附上更為專業的講解,看不懂也沒關系,盡量讀,至少能被專業詞匯洗禮一下!
method 屬性
瀏覽器使用 method 屬性設置的方法將表單中的數據傳送給服務器進行處理。共有兩種方法:POST 方法和 GET 方法。
如果采用 POST 方法,瀏覽器將會按照下面兩步來發送數據。首先,瀏覽器將與 action 屬性中指定的表單處理服務器建立聯系,一旦建立連接之后,瀏覽器就會按分段傳輸的方法將數據發送給服務器。
在服務器端,一旦 POST 樣式的應用程序開始執行時,就應該從一個標志位置讀取參數,而一旦讀到參數,在應用程序能夠使用這些表單值以前,必須對這些參數進行解碼。用戶特定的服務器會明確指定應用程序應該如何接受這些參數。
另一種情況是采用 GET 方法,這時瀏覽器會與表單處理服務器建立連接,然后直接在一個傳輸步驟中發送所有的表單數據:瀏覽器會將數據直接附在表單的 action URL 之后。這兩者之間用問號進行分隔。
一般瀏覽器通過上述任何一種方法都可以傳輸表單信息,而有些服務器只接受其中一種方法提供的數據??梢栽?<form> 標簽的 method (方法)屬性中指明表單處理服務器要用方法來處理數據,使 POST 還是 GET。
POST 還是 GET?
如果表單處理服務器既支持 POST 方法又支持 GET 方法,那么你該選擇哪種方法呢?下面是有關這方面的一些規律:
如果希望獲得最佳表單傳輸性能,可以采用 GET 方法發送只有少數簡短字段的小表單。
一些服務器操作系統在處理可以立即傳遞給應用程序的命令行參數時,會限制其數目和長度,在這種情況下,對那些有許多字段或是很長的文本域的表單來說,就應該采用 POST 方法來發送。
如果你在編寫服務器端的表單處理應用程序方面經驗不足,應該選擇 GET 方法。如果采用 POST 方法,就要在讀取和解碼方法做些額外的工作,也許這并不很難,但是也許你不太愿意去處理這些問題。
如果安全性是個問題,那么我們建議選用 POST 方法。GET 方法將表單參數直接放在應用程序的 URL 中,這樣網絡窺探者可以很輕松地捕獲它們,還可以從服務器的日志文件中進行摘錄。如果參數中包含了信用卡帳號這樣的敏感信息,就會在不知不覺中危及用戶的安全。而 POST 應用程序就沒有安全方面的漏洞,在將參數作為單獨的事務傳輸給服務器進行處理時,至少還可以采用加密的方法。
如果想在表單之外調用服務器端的應用程序,而且包括向其傳遞參數的過程,就要采用 GET 方法,因為該方法允許把表單這樣的參數包括進來作為 URL 的一部分。而另一方面,使用 POST 樣式的應用程序卻希望在 URL 后還能有一個來自瀏覽器額外的傳輸過程,其中傳輸的內容不能作為傳統 <a> 標簽的內容。
以上內容來自W3school
今天的內容結束了,這一篇內容實踐的東西比較少,主要是閱讀與了解。
至此,HTML表單部分的講解就算告于段落了,如果您有任何疑問請給我留言,如有問題或錯誤請予以斧正!
如果您喜歡我的教程請關注我,點贊也能讓我充滿動力!
HTML序章(學習目的、對象、基本概念)——零基礎自學網頁制作
HTML是什么?——零基礎自學網頁制作
第一個HTML頁面如何寫?——零基礎自學網頁制作
HTML頁面中head標簽有啥用?——零基礎自學網頁制作
初識meta標簽與SEO——零基礎自學網頁制作
HTML中的元素使用方法1——零基礎自學網頁制作
HTML中的元素使用方法2——零基礎自學網頁制作
HTML元素中的屬性1——零基礎自學網頁制作
HTML元素中的屬性2(路徑詳解)——零基礎自學網頁制作
使用HTML添加表格1(基本元素)——零基礎自學網頁制作
使用HTML添加表格2(表格頭部與腳部)——零基礎自學網頁制作
使用HTML添加表格3(間距與顏色)——零基礎自學網頁制作
使用HTML添加表格4(行顏色與表格嵌套)——零基礎自學網頁制作
16進制顏色表示與RGB色彩模型——零基礎自學網頁制作
HTML中的塊級元素與內聯元素——零基礎自學網頁制作
初識HTML中的<div>塊元素——零基礎自學網頁制作
在HTML頁面中嵌入其他頁面的方法——零基礎自學網頁制作
封閉在家學網頁制作!為頁面嵌入PDF文件——零基礎自學網頁制作
HTML表單元素初識1——零基礎自學網頁制作
HTML表單元素初識2——零基礎自學網頁制作
HTML表單3(下拉列表、多行文字輸入)——零基礎自學網頁制作
HTML表單4(form的action、method屬性)——零基礎自學網頁制作
HTML列表制作講解——零基礎自學網頁制作
為HTML頁面添加視頻、音頻的方法——零基礎自學網頁制作
音視頻格式轉換神器與html視頻元素加字幕——零基礎自學網頁制作
HTML中使用<a>標簽實現文本內鏈接——零基礎自學網頁制作
*請認真填寫需求信息,我們會在24小時內與您取得聯系。