ion-backdrop
背景板是覆盖其他组件的全屏组件。它们在覆盖其他内容的组件过渡出现时非常有用,并且可以用于关闭该组件。
🌐 Backdrops are full screen components that overlay other components. They are useful behind components that transition in on top of other content and can be used to dismiss that component.
基本用法
🌐 Basic Usage
背景阻止点击或轻触其后面的内容。它默认是透明的,因此下面的演示包括了用于使其可见的 CSS。
🌐 The backdrop prevents clicking or tapping on the content behind it. It is transparent by default, so the below demo includes CSS to make it visible.
样式
🌐 Styling
可以通过直接将 CSS 属性分配给 backdrop 元素来自定义背景。常见属性包括 background-color、background 和 opacity。
🌐 The backdrop can be customized by assigning CSS properties directly to the backdrop element. Common properties include background-color, background and opacity.
通过在内容上设置一个比背景更高的 z-index(默认值为 2),可以在背景上方显示内容。
🌐 Content can be displayed above the backdrop by setting a z-index on the content, higher than the backdrop (defaults to 2).
属性
🌐 Properties
stopPropagation
| Description | If true, the backdrop will stop propagation on tap. |
| Attribute | stop-propagation |
| Type | boolean |
| Default | true |
tappable
| Description | If true, the backdrop will can be clicked and will emit the ionBackdropTap event. |
| Attribute | tappable |
| Type | boolean |
| Default | true |
visible
| Description | If true, the backdrop will be visible. |
| Attribute | visible |
| Type | boolean |
| Default | true |
事件
🌐 Events
| Name | Description | Bubbles |
|---|---|---|
ionBackdropTap | Emitted when the backdrop is tapped. | true |
方法
🌐 Methods
No public methods available for this component.
CSS 阴影部分
🌐 CSS Shadow Parts
No CSS shadow parts available for this component.
CSS 自定义属性
🌐 CSS Custom Properties
No CSS custom properties available for this component.
插槽
🌐 Slots
No slots available for this component.