本文概述
HTML <details>标签用于指定网页上用户可以按需查看或隐藏的其他详细信息。
根据W3C HTML规范, 它用作公开窗口小部件, 用户可以从中检索其他信息或控件。
它与称为<summary>的相关标记一起使用。从技术上讲, 不需要摘要标记, 但是如果你忽略此标记, 则浏览器将使用一些默认文本。
<details>标记将包裹你要显示或隐藏的所有内容, 而<summary>标记则包含该部分的摘要和标题。
HTML details是HTML5中引入的新标签。
让我们举个例子来清楚地了解这一点。
HTML details标签属性
HTML details标记还支持HTML中的全局和事件属性。
details标签提供了一个打开的特定属性。
属性 | 描述 |
---|---|
open | 它指定将向用户显示(打开)详细信息。 |
HTML details标签示例
<details>
<summary>Copyright 2011-2014.</summary>
<p> - by srcmini. All Rights Reserved.</p>
<p>All content and graphics on this web site are the property of the srcmini02.com</p>
</details>
<p><b>Note:</b> The details tag is currently only supported in Opera, Chrome, and in Safari 6.</p>
立即测试
输出:
版权所有2011-2014。
-通过srcmini。版权所有。
该网站上的所有内容和图形都是srcmini02.com的财产。
注意:details标签目前仅在Opera, Chrome和Safari 6中受支持。
支持的浏览器
Element | Chrome | IE | Firefox | Opera | Safari |
<details> | Yes | No | No | Yes | Yes |