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

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

寻∝梦
寻∝梦原創
2018-08-17 17:33:3711162瀏覽

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

#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

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 屬性規定下拉清單中可見選項的數目。

如果 size 屬性的值大於 1,但是小於清單中選項的總數目,瀏覽器會顯示出捲軸,表示可以查看更多選項。

HTML

<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中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn