【Web前瞻】一个可以打开模态窗的 CSS 新属性
CSS :modal
,是一个方便的 CSS 伪选择器提供了一种选择"模态"元素的方法。
目前 Chrome 105 已经开始支持,浏览器兼容性一览:
目前有两种类型的元素被归类为:modal
:
- 使用
showModal
方法的对话框元素。 - 处于全屏模式的元素。
:modal
代码片段示例:
结合顶层渲染伪类 ::backdrop
的全屏效果 modal
演示(如无效果请进入查看详情中运行):
转载自:https://juejin.cn/post/7142425703135313933