HTML details 标签

🌙
手机阅读
本文目录结构
axihe

HTML <details> 标签功能

  • <details> 标签规定了用户可见的或者隐藏的需求的补充细节。

  • <details> 标签用来供用户开启关闭的交互式控件。任何形式的内容都能被放在 <details> 标签里边。

  • <details> 元素的内容对用户是不可见的,除非设置了 open 属性。


HTML <details> 标签用法

使用 <details> 元素:

<details>
    <summary>关于阿西河</summary>
    <ul>
        <li><p>阿西河网址是:www.axihe.com</p></li>
        <li><p>这是一个专注于大前端的网站.</p></li>
    </ul>
</details>

HTML <details> 标签演示

关于阿西河
  • 阿西河网址是:www.axihe.com

  • 这是一个专注于大前端的网站.


浏览器支持

目前,只有 Chrome 和 Safari 6 支持 <details> 标签。


HTML4 与 HTML5 之间的差异

<details> 标签是 HTML5 中的新标签。


提示和注释

提示:与 <summary> 标签配合使用可以为 details 定义标题。标题是可见的,用户点击标题时,会显示出 details。


属性

New :HTML5 中的新属性。

属性描述
openNewopen规定 details 是否可见。

全局属性

<details> 标签支持 HTML 全局属性


事件属性

<details> 标签支持 HTML 事件属性


AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili 和抖音。

关注我: Github / 知乎

如果你加我的私人微信,麻烦写上您的 称呼,所在地区,职业,方便我备注,谢谢


本站的微信公众号

阿西河前端教程

Anbang

安邦的私人微信

微信号: yaolushan

Anbang

Bilibili(B站)

朱安邦

Anbang