首頁 >web前端 >html教學 >html optgroup標籤是什麼意思?關於html optgroup標籤的用法和屬性實例解析

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

寻∝梦
寻∝梦原創
2018-08-21 14:21:544518瀏覽

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

html optgroup標籤的定義和用法:

5b7a15bed8615d1b843806256bebea72 標籤定義選項組。

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

HTML 5b7a15bed8615d1b843806256bebea72 標籤實例:

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

<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 5b7a15bed8615d1b843806256bebea72 標籤的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>

瀏覽器支援

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

全域屬性

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

事件屬性

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

【相關推薦】

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

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

#

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

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

相關文章

看更多