當(dāng)前位置:首頁 >  站長 >  編程技術(shù) >  正文

HTML5輸入框下拉菜單功能的示例代碼

 2020-10-16 16:57  來源: 腳本之家   我來投稿 撤稿糾錯

  域名預(yù)訂/競價,好“米”不錯過

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

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">都喜歡

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

樣式

文本框

3.文本框代碼示例

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

代碼運行界面樣式:

文本域

4.文本域代碼示例

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

注意點:

rows相當(dāng)于height , cols相當(dāng)于width

若想設(shè)置為禁止拖動則添加代碼

<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這是設(shè)置下拉菜單默認(rèn)提示文字

代碼運行演示:

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

來源:腳本之家

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

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

相關(guān)標(biāo)簽
html5教程
下拉菜單

相關(guān)文章

  • 怎么刷百度下拉框 刷百度下拉框代碼

    百度此次的下拉框新模式目前還處于小流量測試階段,到底會變成什么樣,我們不得而知。象百度這樣的互聯(lián)網(wǎng)巨無霸,靠在自己的肩膀上生存的公司,個人不計其數(shù),一旦這個巨人換了一個方向,就會讓很多人搖搖欲墜,迷失在互聯(lián)網(wǎng)里。

    標(biāo)簽:
    刷百度下拉框
    下拉菜單
  • 刷百度下拉框原理和辦法

    對一般刷詞者來說,不要頻繁修改,假如頻繁修改,肯定會影響下拉出單詞的時刻和作用。至于現(xiàn)在已經(jīng)刷出下拉效果的單詞,我們可以把點卡量減一半以維持下拉效果,用余額的另一半月卡來刷其他單詞。這可以節(jié)省開支,做更多的事情,然后降低市場推廣的本錢。

    標(biāo)簽:
    刷百度下拉框
    下拉菜單
  • 百度下拉框營銷推廣怎么做?有工具可以刷?

    現(xiàn)在很多網(wǎng)民在使用百度搜索相關(guān)內(nèi)容的過程中,會發(fā)現(xiàn)只要我們在搜索框中輸入關(guān)鍵詞,那么百度的下拉框就會出現(xiàn)一些相關(guān)關(guān)鍵詞,這就是百度下拉框。

  • 做好這5點基本要求 才能算一個合格的HTML5動畫

    隨著CSS3和HTML5建站技術(shù)的發(fā)展,動效在網(wǎng)頁設(shè)計中的作用越來越顯著。與靜態(tài)界面相比,動態(tài)的轉(zhuǎn)變更符合人們的認(rèn)知體系,可以有效降低用戶認(rèn)知負(fù)載。這是因為,在網(wǎng)站界面使用動畫效果能讓元素的變化、界面的轉(zhuǎn)變、層次結(jié)構(gòu)之間的關(guān)系更加清晰自然。從某種程度上來說,動效還是用戶交互的基礎(chǔ)。那么,什么樣的動效

  • HTML5/CSS3系列教程:HTML5 區(qū)域(Sectioning)的重要性

    不管你以前在web頁面布局中如何稱呼它們-“區(qū)域”還是“塊”,我們一直都在布局中將頁面分成可視的不同區(qū)域。但真正的問題在于我們并沒有使用任何正確的工具來實現(xiàn)。一般情況下我們使用典型的網(wǎng)格來劃分頁頭,頁面主題,頁尾等等區(qū)域來實現(xiàn)所謂的頁面布局。在過去的很多年以來,我們都使用DIV來幫助我們劃分頁面區(qū)域

熱門排行

信息推薦