HTML - open 屬性

HTML **open** 屬性用於指定 **<details>** 元素內容的詳細資訊當前是否可見。

此屬性是一個布林屬性，具有兩個值：“true”和“false”。如果該屬性存在於元素中但沒有值，則為 true。對於 false，如果我們沒有在元素中傳遞 open 屬性，則表示為 false。

當此屬性存在於 **<details>** 元素中時顯示詳細資訊，而當此屬性不存在時則隱藏詳細資訊。預設情況下，此屬性不存在表示詳細資訊不可見。

語法

<details open="true | false">

其中 true 和 false 是可選值，我們可以直接傳遞 open 或連同值 true 和 false 一起傳遞 open。

應用於

下面列出的元素允許使用 HTML open 屬性

元素	描述
<details>	HTML <details> 標籤用於建立一個包含一些資訊的 раскрывающееся виджет。

HTML open 屬性示例

下面的示例將說明 HTML open 屬性，以及我們應該在哪裡以及如何使用此屬性！

帶有 open 屬性的 details 標籤

在下面的示例中，讓我們演示在 <details> 元素中使用 open 屬性，如下所示

<!DOCTYPE html>
<!DOCTYPE html>
<html>
<body>
   <h2> HTML open attribute </h2>
   <details open>
      <summary>Open</summary>
   <p> 
      Tutorialspoint provides access to a library 
      of video courses on various prominent technologies, 
      aimed at helping individuals master those technologies 
      and become certified professionals. By becoming a 
      valued member, users can enjoy unlimited access to the 
      library's comprehensive resources and learning materials. 
   </p>
   </details>
</body>
</html>

沒有 open 屬性的 details 標籤

考慮另一種情況，我們沒有在 <details> 元素中傳遞 open 屬性。如果 open 屬性不存在於 <details> 元素中，則預設情況下內容將被隱藏。

<!DOCTYPE html>
<!DOCTYPE html>
<html>
<body>
   <h2> HTML open attribute </h2>
   <details>
      <summary>Open</summary>
   <p> 
      Tutorialspoint provides access to a library 
      of video courses on various prominent technologies, 
      aimed at helping individuals master those technologies 
      and become certified professionals. By becoming a 
      valued member, users can enjoy unlimited access to the 
      library's comprehensive resources and learning materials. 
   </p>
   </details>
</body>
</html>

支援的瀏覽器

屬性
open	是 12.0	是 79.0	是 40.0	是 6.0	是 15.0

html_attributes_reference.htm

列印頁面