成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

HTML常用表單標(biāo)簽

zhongmeizhi / 1177人閱讀

摘要:也可以通過和屬性來設(shè)置文本域的尺寸,但是屬性設(shè)置不太標(biāo)準(zhǔn),最好的方法是通過設(shè)置。設(shè)置里默認(rèn)大小的文本域?qū)嶋H頁面效果屬性用于設(shè)置文本域可見文本的行數(shù)。此外,屬性也適用于文本域。

1.表單元素

HTML 表單用于收集用戶輸入。

代碼示例:


    

常用屬性解釋:

action屬性定義在提交表單時(shí)執(zhí)行的動作通常,表單會被提交到 web 服務(wù)器上的網(wǎng)頁。在上面的例子中,指定了某個(gè)服務(wù)器腳本來處理被提交表單.

method 屬性規(guī)定在提交表單時(shí)所用的 HTTP 方法(GET 或 POST)

2.輸入input 2.1 文本輸入框

創(chuàng)建一個(gè)最簡單的文本輸入框:

代碼示例:

實(shí)際效果圖:

我們可以在這個(gè)文本框里面輸入任意的數(shù)字、字符或符號

(1)創(chuàng)建一個(gè)帶有提示文字的文本輸入框:

代碼示例:

placeholder 屬性規(guī)定用以描述輸入字段預(yù)期值的提示,該提示會在用戶輸入值之前顯示在輸入字段中。
placeholder 屬性適用于以下輸入類型:text、search、url、tel、email 以及 password。

實(shí)際效果圖:

(2)創(chuàng)建一個(gè)帶有默認(rèn)值的文本輸入框:

代碼示例:

value 屬性規(guī)定輸入字段的初始值。

實(shí)際效果圖:

(3)創(chuàng)建一個(gè)帶有默認(rèn)值且不能修改的文本輸入框:

代碼示例:

readonly 屬性規(guī)定輸入字段為只讀(不能修改),readonly 屬性不需要值。它等同于 readonly="readonly"。

(4)創(chuàng)建一個(gè)禁用的文本輸入框:

實(shí)際效果圖:

disabled 屬性規(guī)定輸入字段是禁用的。被禁用的元素是不可用和不可點(diǎn)擊的。被禁用的元素不會被提交。disabled 屬性不需要值。它等同于 disabled="disabled"。

(5)創(chuàng)建限制輸入字?jǐn)?shù)的文本輸入框:

代碼示例:

maxlength 屬性規(guī)定輸入字段允許的最大長度,如設(shè)置 maxlength 屬性,則輸入控件不會接受超過所允許數(shù)的字符。

如上代碼:我們輸入超過8個(gè)文字后,再輸入任意的文字,文本輸入框都不會接收。

2.2密碼輸入框

創(chuàng)建一個(gè)密碼輸入框,代碼示例:

實(shí)際頁面效果:

密碼輸入框的本質(zhì)還是一個(gè)文本輸入框,只不過密碼輸入框在用戶輸入字段時(shí),會自動的將輸入的文字用星號或?qū)嵭膱A替換,避免用戶密碼直接被其他人看到。

備注:適用在文本輸入框上的屬性同樣也適用于密碼輸入框。

2.3單選按鈕

單選輸入或單選按鈕,通常用與用戶從多個(gè)選項(xiàng)中選擇一個(gè)。

代碼示例:

請選擇您的性別:

實(shí)際效果圖:


注意事項(xiàng):

同一組選項(xiàng)name屬性要保持一致

選定的選項(xiàng)在表單數(shù)據(jù)提交時(shí)提交的格式為 nameVlaue:"selectVlaue",如上代碼表單提交時(shí)提交的值:sex:male

2.3.1創(chuàng)建一個(gè)默認(rèn)選中的單選按鈕

代碼示例:

請選擇您的性別:

checked 屬性規(guī)定按鈕是否默認(rèn)選中狀態(tài)。checked 屬性不需要值。它等同于 checked="checked"。

2.4多選按鈕

多選按鈕,用戶可以從多個(gè)選項(xiàng)中選擇一個(gè)或多個(gè)

I have a pen

I have an apple

實(shí)際效果圖:


多選按鈕也可以通過checked屬性設(shè)置多選按鈕為默認(rèn)選中狀態(tài),多選的情況下表單提交時(shí),多選按鈕提交的值是用英文的逗號隔開的,例如如上表單在提交時(shí), vehicle=pen&vehicle=apple

2.5.按鈕 Button

html中,按鈕通常分為普通按鈕、提交按鈕、重置按鈕,其中提交和重置按鈕用于表單數(shù)據(jù)的提交和清空重置,一般放在form表單里面,普通按鈕可以隨意。

(1)普通按鈕

代碼示例:

實(shí)際頁面效果:

value 屬性可以設(shè)置按鈕上顯示的文字。按鈕可以可以通過disabled屬性來設(shè)置是否禁用。

(2)提交按鈕

表單提交按鈕通常位于form表單內(nèi),點(diǎn)擊后,會將用戶輸入的數(shù)據(jù)提交到指定的地址去處理

代碼示例:

實(shí)際效果圖:


備注:

上述代碼使用的是get方式提交的輸入

get方式提交數(shù)據(jù)時(shí)會在提交的目標(biāo)URL地址后緊跟數(shù)據(jù)字段

value、disabled屬性也適用于submit按鈕

(3)重置按鈕

重置(清空)按鈕通常用于用戶輸入表單數(shù)據(jù)后一鍵清空。也需要放在form表單內(nèi)使用

代碼示例:

備注:value、disabled屬性也適用于reset按鈕

3.文本域

文本輸入框在用于字?jǐn)?shù)不多的文本輸入時(shí)沒有什么問題,但是當(dāng)用戶需要輸入多行、多字?jǐn)?shù)文本時(shí),文本輸入框就會顯得很不友好。因此多行文本的輸入,我們應(yīng)該考慮使用文本域。

代碼示例:




實(shí)際頁面效果:

文本域可容納無限數(shù)量的文本,但默認(rèn)的文本域視覺大小比較小,可以通過文本域右下角的“小三角”拖動來調(diào)節(jié)大小。也可以通過colsrows屬性來設(shè)置文本域的尺寸,但是cols屬性設(shè)置不太標(biāo)準(zhǔn),最好的方法是通過CSS設(shè)置。

3.1設(shè)置里默認(rèn)大小的文本域

實(shí)際頁面效果:

rows 屬性用于設(shè)置文本域可見文本的行數(shù)。

cols 屬性用于設(shè)置文本域可見區(qū)域每行文字的個(gè)數(shù),但是這個(gè)數(shù)量因?yàn)橹杏⑽牟町惒惶珮?biāo)準(zhǔn)。

此外,placeholder name maxlength disabled 屬性也適用于文本域。

4.下拉列表

下拉列表和無序列表類似,都是一種組合類型的標(biāo)簽,通常用于省市區(qū)的選擇。

代碼示例:

所在城市:

實(shí)際頁面效果:

4.2默認(rèn)選中某一項(xiàng)

默認(rèn)的下拉列表選中的是第一項(xiàng),如果需要指定其他選項(xiàng),可以通過selected屬性設(shè)置.

代碼示例:

所在城市:

實(shí)際頁面效果:

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/54601.html

相關(guān)文章

  • 校招進(jìn)行時(shí)(三)---html基礎(chǔ)

    摘要:它可以有與元素事件相關(guān)的客戶端腳本,當(dāng)事件出現(xiàn)時(shí)可觸發(fā)與標(biāo)簽為下拉菜單,需要配合標(biāo)簽一起使用,標(biāo)簽為下拉菜單中的選項(xiàng)。通過指定標(biāo)簽中的或?qū)傩钥稍O(shè)置為下拉菜單或是列表框用于定義多行文本域,和屬性是必須要填寫的,他們用于指定文本域的寬度和高度。 這篇文章銜接上篇,主要羅列一些前端面試中可能問到的html中最基本的問題。 (格式有點(diǎn)亂,內(nèi)容有點(diǎn)水,羅列了一些基本用法,大家隨便看看) 常用標(biāo)簽...

    CarlBenjamin 評論0 收藏0
  • html標(biāo)簽簡介(常用

    摘要:比如等行內(nèi)標(biāo)簽可以多個(gè)標(biāo)簽共同占用一行的標(biāo)簽。標(biāo)準(zhǔn)模式,瀏覽器使用的標(biāo)準(zhǔn)解析渲染頁面。顯示結(jié)果這個(gè)文本包含下標(biāo)文本。表單提交項(xiàng)的值。表單還可以包含和標(biāo)簽。html常識 什么是HTML htyper text markup language ?即超文本標(biāo)記語言 超文本: 就是指頁面內(nèi)可以包含圖片、鏈接,甚至音樂、程序等非文字元素。 標(biāo)記語言: 標(biāo)記(標(biāo)簽)構(gòu)成的語言. 網(wǎng)頁==HTML文...

    Travis 評論0 收藏0
  • 常用HTML標(biāo)簽詳解與總結(jié)

    摘要:今天,我們就來詳細(xì)介紹常用的標(biāo)簽。標(biāo)簽對文字字符進(jìn)行換行處理。標(biāo)簽加入水平分割線。標(biāo)簽語義強(qiáng)調(diào),表示重視。標(biāo)簽有序列表標(biāo)簽。即定義描述,用于添加該名詞的具體解釋。標(biāo)簽用來顯示圖片。默認(rèn)內(nèi)容標(biāo)簽下拉列表,以和兩個(gè)標(biāo)簽配合完成。 對于很多HTML初學(xué)者來說,記憶和掌握標(biāo)簽是一門很難搞的功課。今天,我們就來詳細(xì)介紹常用的HTML標(biāo)簽。對于標(biāo)簽的掌握,更多的是要通過練習(xí),熟能生巧。 stlye...

    DobbyKim 評論0 收藏0
  • HTML常用標(biāo)簽的使用

    摘要:但是,可以在正常的文檔主體中使用。該名稱可以用作標(biāo)簽,標(biāo)簽的屬性值,或標(biāo)簽和標(biāo)簽的屬性值。標(biāo)簽元素用于為基于的表單創(chuàng)建交互式控件,以便接受來自用戶的數(shù)據(jù)。標(biāo)簽的元素表示表格數(shù)據(jù)即通過二維數(shù)據(jù)表表示的信息。 一、常見標(biāo)簽詳解 1、標(biāo)簽 HTML內(nèi)聯(lián)框架元素 表示嵌套的瀏覽上下文,有效地將另一個(gè)HTML頁面嵌入到當(dāng)前頁面中。在HTML 4.01中,文檔可能包含頭部和正文,或頭部和框架集,...

    nevermind 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<