阿里云優(yōu)惠券 先領券再下單

這篇文章主要介紹了HTML5輸入框下拉菜單功能，本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友參考下吧

1.單選框代碼

<span>性別：</span>
            <input name="sex" value="" type="radio">男
            <input name="sex" value="" type="radio">女

需要注意的是單選框name值需保持一致

樣式：

復選框

2.復選框代碼

 <span>喜歡的類型：</span>
    <input type="checkbox">嫵媚的
    <input type="checkbox">可愛的
    <input type="checkbox">小鮮肉
    <input type="checkbox">老臘肉
    <input type="checkbox">都喜歡

如需要進行form表單提交 則需要name的屬性一樣

樣式

文本框

3.文本框代碼示例

<span>所在地區(qū)：</span>
    <input type="text">

代碼運行界面樣式：

文本域

4.文本域代碼示例

<span class="te2">自我介紹：</span>
    <textarea rows="2" cols="21"></textarea>

注意點：

rows相當于height ， cols相當于width

若想設置為禁止拖動則添加代碼

<textarea style="resize:none;"></textarea>

代碼運行示例：

下拉菜單

5.下拉菜單代碼示例：

<select name="" id="">
        <option value="" disabled selected hidden>--請選擇月--</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>

注意點：disabled selected hidden這是設置下拉菜單默認提示文字

代碼運行演示：

到此這篇關于HTML5輸入框下拉菜單功能的示例代碼的文章就介紹到這了,更多相關HTML5輸入框下拉菜單內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持腳本之家！

來源：腳本之家

鏈接：https://www.jb51.net/html5/744182.html

申請創(chuàng)業(yè)報道，分享創(chuàng)業(yè)好點子。點擊此處，共同探討創(chuàng)業(yè)新機遇！