首頁 > web前端 > html教學 > html select標籤的用法你知道嗎? html select標籤屬性介紹

html select標籤的用法你知道嗎? html select標籤屬性介紹

寻∝梦
發布: 2018-08-17 17:33:37
原創
11221 人瀏覽過

html select標籤的用法你知道嗎? html select標籤屬性介紹。以下為大家介紹html select標籤的一些用法,還有html select標籤屬性的一些介紹

html select標籤的定義和用法:

select 元素可創建單選或多選選單。

html select標籤的屬性:

html select標籤的用法你知道嗎? html select標籤屬性介紹

#HTML

HTML

允許在下拉清單中進行多重選擇:

<select multiple="multiple" size="2">
  <option value ="volvo">Volvo</option>
  <option value ="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
登入後複製

html select標籤的multiple屬性定義與用法:

multiple 屬性規定可同時選擇多個選項。

在不同作業系統中,選擇多個選項的差異:

對於windows:按住Ctrl 按鈕來選擇多個選項

對於Mac:按住command 按鈕來選擇多個選項

由於上述差異的存在,同時由於需要告知使用者可以使用多項選擇,對使用者更友善的方式是使用複選框。

提示:可以把 multiple 屬性與 size 屬性搭配使用,來定義可見選項的數目。

語法

<select multiple="value">
登入後複製

html select標籤multiple屬性的屬性值:

multiple :  規定可同時選擇多個選項。

HTML 標籤實例:

帶有name 屬性的下拉清單:

<select name="carlist">
  <option value ="volvo">Volvo</option>
  <option value ="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
登入後複製

html select標籤name屬性的定義和用法

#name 屬性規定select 元素的名稱。

name 屬性用於對提交到伺服器後的表單資料進行標識,或在客戶端透過 JavaScript 引用表單資料。

html select標籤name屬性的語法:

<select name="value">
登入後複製

html select標籤name屬性的屬性值:

name  :  下拉清單的名稱。

HTML 標籤實例:

在下拉清單中size 屬性顯示兩選項:

<select size="2">
  <option value ="volvo">Volvo</option>
  <option value ="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
登入後複製

HTML標籤size屬性的語法:

<select size="value">
登入後複製

HTML

number  :  下拉清單中可見選項的數目。

select標籤及其標籤元素:

特點(區別於其他同父元素下的標籤)

作用(他的特點注定了他的角色)

使用場景(工程項目)

怎麼樣使用(需要容納在那個標籤下、需要配合哪些標籤使用)

解答:

建立下拉清單

擴充:select和ul/li有什麼異同?和table呢?

註冊帳號時選擇所在地,包含生日

擴充功能:現在html5中已經能夠使用data來實作日期選擇了

使用方法和datalist大同小異

#擴充:使用select的時候是無法實現輸入的,如果既想要實現輸入又想要實現選擇呢?

預設選項的屬性能實現什麼有趣的東西嗎?

資料比較複雜的時候如何將資料分類?

要」自然而然地聯想到」某個標籤元素\屬性需要什麼條件?

解答擴展

說是下拉列表,select的作用不是展示,而是伺服器後台與用戶之間的互動,本質上還是用戶要提交一個數據,只不過相比起input標籤,更重視使用者體驗而已

往往是多個select標籤一起使用的,國家-城市-地區,我們可以取得到使用者的IP會把參數賦予對應的option標籤,然後實作預設選中國家

這個實際上涉及到」自學的人要怎麼樣校驗自己學習的成果」這個問題,如果你要求的校驗方式是看到某一個標籤就能回答上關於這個標籤的一切學習過的內容,包括細節,這是不容易的,遠比你做一套題或說回答你預設的那4個問題要難

HTML 4.01 與HTML 5 之間的差異

HTML5 新增了一些新屬性。

提示:select 元素是一種表單控件,可用於在表單中接受使用者輸入。

【相關推薦】

html5 meter標籤是什麼意思? html5 meter度量衡如何改變顏色詳解

html meta標籤的作用是什麼? html meta標籤常見的屬性介紹

以上是html select標籤的用法你知道嗎? html select標籤屬性介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板