HTML5輸入框下拉菜單功能的示例代碼
發(fā)布時(shí)間:2020-09-08 15:30:39 作者:Web_weak chicken
我要評(píng)論

這篇文章主要介紹了HTML5輸入框下拉菜單功能,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧
1.單選框代碼
<span>性別:</span> <input name="sex" value="" type="radio">男 <input name="sex" value="" type="radio">女
需要注意的是單選框name值需保持一致
樣式:
復(fù)選框
2.復(fù)選框代碼
<span>喜歡的類型:</span> <input type="checkbox">嫵媚的 <input type="checkbox">可愛的 <input type="checkbox">小鮮肉 <input type="checkbox">老臘肉 <input type="checkbox">都喜歡
如需要進(jìn)行form表單提交 則需要name的屬性一樣
樣式:
文本框
3.文本框代碼示例
<span>所在地區(qū):</span> <input type="text">
代碼運(yùn)行界面樣式:
文本域
4.文本域代碼示例
<span class="te2">自我介紹:</span> <textarea rows="2" cols="21"></textarea>
注意點(diǎn):
rows相當(dāng)于height , cols相當(dāng)于width
若想設(shè)置為禁止拖動(dòng)則添加代碼
<textarea style="resize:none;"></textarea>
代碼運(yùn)行示例:
下拉菜單
5.下拉菜單代碼示例:
<select name="" id=""> <option value="" disabled selected hidden>--請(qǐng)選擇月--</option> <option value="">1</option> <option value="">2</option> <option value="">3</option> <option value="">4</option> <option value="">5</option> <option value="">6</option> <option value="">7</option> <option value="">8</option> <option value="">9</option> <option value="">10</option> <option value="">11</option> <option value="">12</option> </select>
注意點(diǎn):disabled selected hidden這是設(shè)置下拉菜單默認(rèn)提示文字
代碼運(yùn)行演示:
到此這篇關(guān)于HTML5輸入框下拉菜單功能的示例代碼的文章就介紹到這了,更多相關(guān)HTML5輸入框下拉菜單內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持腳本之家!
相關(guān)文章
- 一款html5表單實(shí)例select表單樣式美化select單選框表單提交代碼2014-04-15
- 有時(shí)候?yàn)g覽器有很多緩存,我們就執(zhí)行不了某種操作,必須要清除緩存才可以運(yùn)行,其實(shí)多數(shù)瀏覽器默認(rèn)會(huì)緩存input的值,只有使用ctl+F5強(qiáng)制刷新的才可以清除緩存記錄。如果不2014-11-11
HTML5單選框、復(fù)選框、下拉菜單、文本域的實(shí)現(xiàn)代碼
這篇文章主要介紹了HTML5單選框、復(fù)選框、下拉菜單、文本域的實(shí)現(xiàn)代碼,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以2020-12-01