图片热点
圖片熱點:
??? 規劃出圖片上的一個區域,可以做出超鏈接,直接點擊圖片區域就可以完成跳轉的效果
?
?
網頁劃區:
??? 在一個網頁里,規劃出一個區域用來展示另一個網頁的內容。
?
?
?
?
網頁的拼接:
??? 在一個網絡頁面內,規劃出多個頁面窗口,以表格拼接的形式展示出來。
?
表單:
<form id="" name="" method="post/get" action="負責處理的服務端">
id不可重復,name可重復,get提交有長度限制,并且編碼后的內容在地址欄可見,
post提交沒有長度限制,且編碼后內容不可見。
</form>
1.文本輸入
??? 文本框<input type="text" name="" id="" value="" />
??? 密碼框<input type="password" name="" id="" value="" />
??? 文本域<textarea name="" id="" cols=""(字符多少) rows=""(幾行高)></textarea>
??? 隱藏域<input type="hidden" name="" id="" value="" />
2.按鈕
??? 提交按鈕<input type="submit" name="" id="" disabled="disabled" value="" />點擊后轉到form內的提交服務器的地址
??? 重置按鈕<input type="reset" name="" id="" disabled="disabled" value="" />
??? 普通按鈕<input type="button" name="" id="" disabled="disabled" value="" />
??? 圖片按鈕<input type="image" name="" id="" disabled="disabled" src="圖片地址" />
??? disabled使按鈕失效
??? enable使按鈕可用
3.選擇輸入
??? 單選按鈕組<input type="radio" name="" checked="checked" value="" />
??? name的值用來分組,value的值看不見,提交給程序用的,checked設置默認選項。
??? 復選框組<input type="checkbox" name="" checked="checked" value="" />
??? 文件上傳<input type="file" name="" id="" />
??? <lable for=""></lable>
??? lable標簽為input元素定義標注。
??? lable元素不會向用戶呈現任何特殊效果,不過,他為鼠標用戶改進了可用性。如果您在lable元素內點擊文本,就會觸發此控件。
??? 就是說,當用戶選擇該標簽時,瀏覽器會 將焦點轉到和標簽相關的表單控件上。
??? lable標簽的for屬性應當與相關元素的id屬性相同。
4.下拉列表框
??? <select name="" id="" size="" multiple="multiple">
??? --size為1時,為菜單;>1時,為列表。multiple為多選。
??????? <option value="值">內容1</option>
????? ??<option value="值" selected="selected">內容2</option>
??????? --selected,設為默認
??????? <option value="值">內容3</option>
??? </select>
5.標簽
??????? ?<label></label>
字段集 (一堆label)
???????? ??????? ?<fieldset></fieldset>
快速制作網頁的方法:
??? 利用Photoshop中的切片工具來規劃出要設置鏈接的位置,設置好后存儲為web可使用的html格式。
用DREAMWEAVER打開,打開設計頁面,選擇切片弄好的位置,在屬性中輸入超鏈接的網址即可。
?
總結
- 上一篇: Flexible 弹性盒子模型之CSS
- 下一篇: Flexible 弹性盒子模型之CSS