HTML popover 属性
定义和用法
popover
属性将一个元素定义为一个 popover 元素,这意味着当它被调用时,它将显示在内容之上,不会干扰其他 HTML 元素的位置。
popover 元素在被另一个元素调用之前是不可见的。另一个元素必须有一个 popovertarget
属性,其值引用 popover 元素的 id。
popover 元素将显示在所有其他内容之上,通过单击 popovertarget 元素,popover 元素将在显示和隐藏之间切换。
Hello
popover 元素可以是一个单独的 HTML 元素,也可以是整个 HTML 元素的部分。请参阅下面的示例。
适用范围
popover
属性是 全局属性,可用于任何 HTML 元素,但该元素必须是可编辑的。
元素 | Attribute |
---|---|
所有 HTML 元素 | popover |
示例
示例
添加一个带有 popover 属性的 <h1> 元素,以及一个用于显示/隐藏它的按钮
<h1 popover id="myheader">Hello</h1>
<button popovertarget="myheader">Click me!</button>
自己动手试一试 »
示例
将 DIV 元素用作 popover 元素
<div popover id="mydiv">
<h2>Popover</h2>
<hr>
<p>Popover 是一个显示在所有其他内容之上的元素。</p>
<p>当你想传达重要信息时可以使用它。</p>
</div>
自己动手试一试 »
浏览器支持
Attribute | |||||
---|---|---|---|---|---|
popover | 114 | 114 | 125 | 17 | 100 |