Html簡易表單製作

2021-07-05 06:19:24 字數 1437 閱讀 5870

可以很清楚的了解到具體沒個項所應用的表單類目,然後分析下版面排版,所以對於有過知道簡單的html、table等知識就已經夠用了。

1.先建立乙個空html的文件,因為這是乙個**的東西,所以需要乙個**,但是現在還沒辦法確定**的行數與列數,所以可以分塊來做。我就首先做了乙個table,然後建立了一行tr,又建立單元格td,建立了兩個單元格,第乙個只佔一列,第二個佔據3列,在通過新增背景色,寫上文字,插上,調調寬度就搞定了。

2.所以第二行也同樣 ,只不過只需要乙個四列的td就可以了

3.接下來,使用者名稱、密碼、確認密碼(每個作為一行)當做一部分,先建立三個td,第三個佔2列,所以版式就好了,然後新增內容,第二個只需要新增表單元素中的文字框即可(最後所有表做好後,再新增form表單元素就可以了,因為要提交整個表,開始就不需要在意)。這一部分就很快完成了。不過需要好好調整好對齊方式,密碼框的型別選擇等問題。

4.然後在將下面的單選,複選,下拉(每個作為一行)一起做出,單選按鈕比較容易出錯,開始做了後,發現沒法單選,後來問了老師才知道,原來單選應該讓他們的name相同,那樣才可以成為一組,這樣才可以確認出二選一。核取方塊的比較簡單,只要選好form元素就好了,沒什麼問題。下拉列表則要用到select和option。之前沒注意到,做好後,發現老是最下面的那個選項為預設顯示的,還以為就是最後乙個作為顯示在預覽時顯示,最近又做了乙個類似的表單才發現,原來在option中有乙個selected="selected"項,只要有他,就證明被選中,所以會顯示為預設,所以在列表很多選項中,想讓誰顯示,就給他自己新增就好了,要不就會預設最下面的那個了。這三個欄目因為沒有最後面的提示灰色字部分,所以可以將td直接調整為佔3列或者2列,因為版式每個人想的不同,只要效果沒問題就可以。

5.家庭住址與電子郵件同樣利用文字控制項元素搞定,下面的複選專案也是複選罷了。

6.接下來是兩個按鈕,第乙個因為需要提交表單,所以需要用submit,這個按鈕是專門為提交form的,value是要顯示的按鈕中的文字;重置方法相同,只是選個reset,並且value為重置就可以了。

7.接下來是下面的一堆協議文字,因為字數過多,所以是不能用文字控制項的,但是form中提供了乙個textarea文字域,所以用這個就可以解決這種大面積文字問題了,在調整好列行就可以,但是對於協議內容,**應該是只允許讀,不能修改的,所以要再新增乙個readonly="readonly"

8.頁面最下面還有乙個版權的類目,所以通過©就可以了,並且這也是一行,這樣基本**就完成了,再做做收尾工作,去掉**的border,美化一下,然後再新增上form元素標籤就大功告成了。

9.不過做完乙個東西,還是要多檢查檢查,大體翻閱一下**,並且再多個瀏覽器中查閱一下,這樣可以使作品更加完善。

簡易表單驗證外掛程式

學習完一門語言時難免會有一些想法與激情來驅動我們開發,以下是本人為了學習所編寫的輪子,即使別人寫的再香,我也想構造一套自己的表單驗證 form.evaluate submit function if typeof modelstr boolean var vmodel notice 請填入您的姓名 ...

基於jQuery的簡易表單校驗擴充套件

如今網上已經有不少表單校驗的js lib,自己沒研究過那些 乾脆自己寫乙個簡單的。輪子輪子 1.直接看 基於jquery的表單校驗 author halzhang twitter version v0.2 實現正則任意擴充套件 jquery.fn.validator function options...

html表單製作

表單 收集不同型別的使用者輸入資訊。輸入框,密碼框,文字框,下拉列表,單選,多選,form標籤 作用 定義乙個表單。乙個表單是又表單元素組成的.標籤 是指開始標籤到結束標籤。元素 指在html中,從開始標籤到結束標籤的所有 統稱為乙個元素。表單元素 不同型別的input元素,以及單選框,提交按鈕等。...