html optgroup標籤是什麼意思？關於html optgroup標籤的用法和屬性實例解析-html教學-PHP中文網

首頁

web前端

html教學

html optgroup標籤是什麼意思？關於html optgroup標籤的用法和屬性實例解析

寻∝梦

Aug 21, 2018 pm 02:21 PM

html

html optgroup標籤是什麼意思？關於html optgroup標籤的用法和屬性實例解析都在這篇文章中，為大家介紹了html optgroup標籤的定義和屬性實例，還有html optgroup標籤的使用方法

html optgroup標籤的定義和用法：

標籤定義選項組。

optgroup 元素用於組合選項。當您使用一個長的選項清單時，對相關的選項進行組合會使處理更加容易。

HTML 標籤實例：

#透過標籤把相關的選項組合在一起：

<select>
  <optgroup label="Swedish Cars">
    <option value ="volvo">Volvo</option>
    <option value ="saab">Saab</option>
  </optgroup>
  <optgroup label="German Cars">
    <option value ="mercedes">Mercedes</option>
    <option value ="audi">Audi</option>
  </optgroup>
</select>

登入後複製

html optgroup標籤必需的屬性：

label ： text ：為選項組規定說明。（如上實例）

html optgroup標籤可選的屬性：

disabled ： disabled ：規定停用此選項組。

HTML 標籤的disabled 屬性

optgroup標籤的disabled屬性定義：

#disabled 屬性規定停用該選項組。被停用的選項組既不可用，也不可點選。

可以設定 disabled 屬性，直到滿足某些條件（例如選擇一個複選框），才恢復使用者對該選項組的使用。然後，可以使用 JavaScript 來清除 disabled 屬性，以使選項群組變為可用狀態。

optgroup標籤的disabled屬性實例

一個已停用的選項組：

<select>
  <optgroup label="German Cars" disabled="disabled">
    <option value="mercedes">Mercedes</option>
    <option value="audi">Audi</option>
  </optgroup>
</select>

登入後複製

html中optgroup標籤用法，分組、唯讀的且呈樹狀樣式顯示：

#在html的select標籤中除了了option標籤外，還有一個標籤就是optgroup 。它能幫我們做什麼咧？

從名稱我們就已經領會到接分意思：它是一個option的群組，就像checkboxgroup、radiogurop一樣，是分組用的；

#看看下面一段程式碼，在瀏覽器中開啟你可以看到一個下拉式選單。但是當你選擇java或.Net的時候，是不能選擇的。

而且樣式和option標籤的樣式也不同，字體加粗了。且下拉式選單呈樹狀的樣式顯示。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>  
    <head>  
        <title>optgroup</title>  
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
        <meta http-equiv="description" content="this is my page">  
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">  
    </head>  
    <body>  
        <select>  
            <optgroup label="Java">  
                <option value="jsp Servlet">jsp Servlet</option>  
                <option value="javaEE">javaEE</option>  
            </optgroup>  
            <optgroup label=".Net">  
                <option value="aspx">aspx</option>  
                <option value="C#">C#</option>  
            </optgroup>  
        </select>  
    </body>  
</html>

登入後複製

瀏覽器支援

所有主流瀏覽器都支援標籤。

全域屬性

標籤支援 HTML 中的全域屬性。

事件屬性

標籤支援 HTML 中的事件屬性。

【相關推薦】

html abbr標籤是什麼意思？ html abbr標籤的具體用法詳解

html address標籤怎麼用？ html address標籤的使用方法詳解

以上是html optgroup標籤是什麼意思？關於html optgroup標籤的用法和屬性實例解析的詳細內容。更多資訊請關注PHP中文網其他相關文章！

本網站聲明