HTML教程-HTML<details>标签
HTML <details>标签用于在网页上指定用户可以根据需要查看或隐藏的附加详细信息。
根据W3C HTML规范,它用作披露小部件,用户可以从中检索附加信息或控制。
它与一个相关的标签 <summary> 配合使用。从技术上讲,不需要 summary 标签,但如果忽略它,浏览器将使用一些默认文本。
<details> 标签包裹了要显示或隐藏的所有内容,而 <summary> 标签包含了该部分的摘要和标题。
HTML details是HTML5中引入的新标签。
让我们通过一个示例来更清楚地理解。
HTML Details标签属性
HTML details标签还支持HTML中的全局和事件属性。
details标签提供了一个特定的 open 属性。
| 属性 | 描述 |
|---|---|
| open | 指定详情将对用户显示(打开)。 |
HTML Details标签示例
<details>
<summary>Copyright 2011-2014.</summary>
<p>- by JavaTpoint. All Rights Reserved.</p>
<p>All content and graphics on this web site are the property of the javatpoint.com</p>
</details>
<p><b>Note:</b> The details tag is currently only supported in Opera, Chrome, and in Safari 6.</p>注意:details标签目前只在Opera、Chrome和Safari 6中受支持。
支持的浏览器
| 元素 | Chrome | IE | Firefox | Opera | Safari |
|---|---|---|---|---|---|
<details> | 是 | 否 | 否 | 是 | 是 |
Chrome
IE
Firefox
Opera
Safari