第三課時 HTML表單和框架
第三課時 HTML表單和框架
一、<form>表單
1.定義:用來收集用戶信息,提供服務
2.表單的簡單框架:
<form>
<input>
<select>…</select>
<textarea>…</textarea>
</form>
3.<form>標記的主要屬性:
a.action:指出該表單所對應的處理程序的位置(url)
b.method:指出表單信息的提交方式:get(默認)或post
get:提交總信息不超過2K,且提交后可以在地址欄中看到
post:提交信息長度不限,且不會顯示在地址欄中
c.enctype:表單數據的編碼方式:
application/x-www-form-urlencoded(默認):鍵值對編碼
multipart/form-data:二進制流編碼(用于傳輸文件)
d.target:類似超鏈接中的target
二、<form>中的<input>標記
<form>有三個輸入子標記,用于收集用戶信息。<input>是應用最為廣泛的。
1.<input>的主要屬性:
a.Type:指定輸入比較的輸入方式:(共10中方式)
text:單行文本框
password:密碼文本框
hidden:隱藏文本框
file:文件選擇框
checkbox:復選框
radio:單選框
-----------------
Button:普通按鈕(要添加腳本才有動作,否則不做任何事情)
Submit:提交按鈕(提交<from>標簽內的所有信息)
Reset:重置按鈕
Image:圖片按鈕(功能同提交按鈕)
b.size:文本框的長度
c.maxlength:文本框允許輸入的最大長度(控制輸入長度的最簡單辦法)
d.value:當type為文本類型時,value代表初始值和提交值
當type為按鈕類型時,value為按鈕的顯示文本(因為按鈕不需要提交值)
e.checked(標示屬性):使用在type=”checkedbox|radio”時,表示被選中狀態
注:使用radio時,name的值要一直,否則達不到一組的效果。
三、<form>中的其他標記
1.<select>:下拉列表選擇標記
<select size=”” multiple>
<option selected value=””>…選項內容…</option>下拉選項
</select>
Size:下拉列表顯示的項數。
Multiple(標識屬性):開啟多選功能
Selected(標識屬性):表示被選中的狀態
Value:表示這個下拉選項的提交值
2.<textarea>多行文本標記:
<textarea rows=”” cols=””>…</textarea>
3.filedSet分組標記:
<filedset>
<legend>...</legend>
…可以把不同的標記用框框分組顯示
</filedset>
Legend:表示框框標題名字。
四、<form>中所有標記都有的屬性
1.name:名字,常用于調用時的參數
2.ID:同name
3.title:提示信息
4.tabIndex:定義tab鍵的反問順序
5.Accesskey:定義ALT+“”的快捷訪問鍵
五、框架
1.定義:可以把一個瀏覽器窗口分成若干獨立的子窗口,字窗口相互獨立的滾動刷新,可以有所聯系,
2.簡單使用:
<html>
<head>…</head>
<frameset cols=”30%,*”>
<frame src=””>
<frame src=””>
</frameset>
</html>
用<frameset>標記代替<body>,若把<frameset>標記放在<body>內,<frameset>將不起作用。
3.<frameset>的主要屬性:
a.cols:縱向分割,cols=”像素|百分比|*”三種方式:
像素:為單個像素占總像素的比例
百分比:直接算整個區域的百分比
*:若只出現一個*,代表窗口剩余部分;若出現多個*,就所有*號按比例分窗口剩余部分。
b.rows:橫向分割(使用同縱向)
c.border:分割線寬度
d.bordercolor:分割線顏色
e.frameborder:設置是否隱藏分割線,為YES是顯示,NO為隱藏
3.<frameset>中使用的標記:
a.<frame>子窗口標記:
<frame src=”” name=”” noresize scrolling=”no|yes” marginwidth=”” >
Src:子窗口路徑 name:子窗口名字
Noresize(標識屬性):不允許改變分割線位置
Scrolling:定義是否需要滾動條
Marginwidth:文本與分割線的寬度
Marginheight:文本與分割線的高度
b.<iframe>內聯窗口標記(浮動窗口標記)
與<frame>的不同:
<iframe>必須放在<body>中,而<frame>不需要。
<frame>必須嵌在<frameset>中,而<iframe>不需要。
<iframe>可以自定義高寬度,而<frame>是通過<frameset>定義的。
posted @ 2009-07-21 14:44 鑫龍 閱讀(555) | 評論 (0) | 編輯 收藏