HTML學習隨筆
表頭<head>
<title> 瀏覽器標題欄顯示的內容
<base> 有href和target屬性,href指定網頁中所有超鏈接的基本目錄,target指定打開超鏈接的方式,如_blank為在新窗口中打開
<meta> name網頁的描述信息,可以設置網頁搜索的關鍵字keywords。http-equiv可以設置自動刷新
如:<meta http-equiv=”refresh” content=”3”;url=http://sina.com.cn” /> 設置3秒自動刷新
<link> rel屬性:描述目標文檔與當前文檔的關系,type:文檔類型,media:目標文檔在哪種設備上起作用,如顯示器或打印機
表單<form>
用來與服務端進行交互,意味著只要不和服務端交互就不需要form標簽
<input>的type屬性
-
text:文本框
-
password:密碼框
-
radio:單選框,需要指定同一組(即name值相同)
-
checkbox:復選框
-
file:文件選擇
-
hidden:隱藏組件。不會在頁面上顯示,但其定義的name和value可以提交給服務器
-
botton:按鈕組件。默認沒有效果,可以通過註冊事件並加入自定義效果
-
submie:提交按鈕
-
reset:重置按鈕
-
image:圖像組件。可以通過image的src屬性連接一個按鈕圖片代替submit
下垃菜單<select>
每一個下拉菜單項都由option進行封裝
<select>
<option></option>
<option></option>
</select>
文本區域<textarea>
表格<table>
<table>
<tbody>
<tr>
<td></td>
<td></td>
</tr>
</tbody>
</table>
超鏈接<a>
<a href="http://www.sina.com.cn" target="_blank"> 新浪網站<a>
http:為解析程序,即使用http協議解析鏈接。設置target屬性,在新窗口打開鏈接。
<a href="mailto:[email protected]?subject=haha&[email protected]" > 聯系我們 </a>
當點擊超鏈接時,就會出現郵件相關聯的解析程序,本機默認的是outlook.
鏈接訊雷的解析程序可以自己百度,這裏就不說了。
form標簽常見屬性
action
method(get和post)
get和post區別:
get會將提交的數據顯示在瀏覽器的地址欄上,post則不會
get提交的數據的體積受地址欄的限制(即不能超過地址欄的長度),post沒有這種限制
get對於敏感信息不安全(如用戶名和密碼),post安全
get會將提交的信息封裝在請求行,即http消息頭之前,post會將提交信息封裝在數據何體中,即http消息頭之後的空行後
對於服務器來說:
表單form提交數據盡量用post,因為涉及到編碼問題。tomcat服務端默認的解碼是ISO8859-1
對於post提交的中文,在服務端可以直接使用setCharacterEncoding("gbk")就可以解決。而對於get提交的中文,在服務端只能通過ISO8859-1將數據編碼一次,再通過指定的碼表(如GBK)解碼。
其他
-
<label>標簽:當點擊用戶名這欄時(不是點擊文本框)或按Ctrl+u快捷鍵,焦點也會到了文本框內
<label acdessky=”u” for=”userid”> <tr> <td> 用戶名(U):</td> <td> <input type=”text” name=”user” id=”userid” /></td> </tr> </label>
- 書寫鏈接地址時,必須避免重定向,例如:href="http://sina.com/",即須在URL地址後面加上"/"
- 在頁面中盡量避免使用style屬性,即style="..."
-
必須為含有描述性的表單元素(input,textarea)添加label。
<p> <label for=”name”>姓名:</label> <input type=”text” id=”name” /> </p>
- 能以背景形式呈現的圖片,盡量寫入CSS樣式中
- 重要圖片必須加上alt屬性
- class和id的使用:id是唯一的並是父級的,class是可以重復的並是子級的,所以id僅使用在大的模塊上,class可用在重復使用率高及子級中。id原則上都是由分發框架文件時命名的,為javaScript預留鉤子的除外。
-
為javaScript預留鉤子的命名,請以js_起始,比如: js _show、js _hide。
over!
HTML學習隨筆