form表單提交數(shù)據(jù)的幾個(gè)注意事項(xiàng):
創(chuàng)新互聯(lián)建站堅(jiān)持“要么做到,要么別承諾”的工作理念,服務(wù)領(lǐng)域包括:成都網(wǎng)站建設(shè)、做網(wǎng)站、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù),滿足客戶于互聯(lián)網(wǎng)時(shí)代的永福網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求,幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴!
1.所有獲取用戶輸入的標(biāo)簽都必須在form表單里面
2.action控制著往哪兒提交
3.input\select\textarea 都需要有name屬性
4.提交按鈕input type="submit"
input 系列的type屬性
text 文本框
password 密碼框
radio 單選框
checkbox 復(fù)選框
date 日期
file 文件(可以上傳圖片)
button 普通按鈕,多用JS給它綁定事件
reset 重置按鈕
submit 提交按鈕
textarea 大段文本
按鈕的樣式是可以自己寫的,可以把按鈕的默認(rèn)樣式隱藏掉, border-style:none;然后自己隨便定義啊,寬度 width 高度height 背景圖片或顏色 background 邊框 border 鼠標(biāo)形態(tài) cursor等等
可以自定義啊,你是要自定義樣式吧?表單按鈕你可以把他看做一個(gè)行內(nèi)元素,css對(duì)應(yīng)的margin padding background color border border-radius這些屬性都是支持的,可以對(duì)他的樣式隨便進(jìn)行修改。
解決方法:用普通標(biāo)簽?zāi)M,背景圖設(shè)置在普通標(biāo)簽里面,表單功能還是用input來實(shí)現(xiàn),交互功能得用JavaScript來實(shí)現(xiàn)。換句話說,CSS控制普通標(biāo)簽的樣式來美化表單,JavaScript實(shí)現(xiàn)表單交互功能。
案例分析:
移動(dòng)端兼容 - 調(diào)用相冊(cè)的按鈕樣式處理
具體情形:input type="file" accept="image/*;capture=camera"或者input type="file" capture="photo"設(shè)背景圖無效。在我們的移動(dòng)端網(wǎng)頁當(dāng)中,會(huì)有上傳照片的操作需求。此時(shí)會(huì)使用到文件類型的input文本框,但是不同的系統(tǒng)不同的瀏覽器在樣式上均不相同,而且,設(shè)置背景圖也沒有效果。
解決方法:通過設(shè)置opacity為0來進(jìn)行模擬,背景圖設(shè)置在其他標(biāo)簽里面。換句話說樣式用普通標(biāo)簽?zāi)M,功能用input來實(shí)現(xiàn)。
測(cè)試效果圖:
《CSS美化表單大集錦》