Web前瞻一个可以打开模态窗的 CSS 新属性
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Web前瞻一个可以打开模态窗的 CSS 新属性相关的知识,希望对你有一定的参考价值。
CSS :modal
,是一个方便的 CSS 伪选择器提供了一种选择"模态"元素的方法。
目前 Chrome 105 已经开始支持,浏览器兼容性一览:
目前有两种类型的元素被归类为:modal
:
- 使用
showModal
方法的对话框元素。 - 处于全屏模式的元素。
:modal
代码片段示例:
结合顶层渲染伪类 ::backdrop
的全屏效果 modal
演示(如无效果请进入查看详情中运行):
以上是关于Web前瞻一个可以打开模态窗的 CSS 新属性的主要内容,如果未能解决你的问题,请参考以下文章
前端每日实战:160# 视频演示如何用纯 CSS 创作一个打开内容弹窗的交互动画
用于删除 Angular 材质 v5 模态背景的 CSS 代码