css - 哪些浏览器支持 CSS 显示属性的多个关键字值?

标签 css

CSS3 allows在单个 display 规则中指定 display-outside 和 display-inside 值。

例如:

display: block flow;
display: inline table;
display: flex run-in;

CSS MDN page没有说明哪些浏览器支持这种多关键字语法。

目前哪些浏览器支持 CSS3 的 display 多个关键字值,支持它的浏览器中存在哪些怪癖(如果有的话)?


编辑(对结束投票的回应):

不是寻求推荐或寻求他人寻找外部工具/资源。

这个问题的目的是帮助我(和其他人)根据当前目标平台(浏览器引擎)对它的支持程度来决定是否在我编写的代码中使用这个 CSS 特性,而不是帮助我选择一个浏览器(我已经拥有所有这些浏览器——IE、Edge、Chrome、FF、Safari,并且我针对所有这些浏览器的最新版本进行开发和测试)。

基本上,我在问同样的问题 this flexbox 的答案,但用于不同的 CSS 功能。 IE。 如果我要使用此 CSS 功能,会对我的用户群产生什么影响?(这取决于我的应用程序的用户群,但任何人都可以自己回答给定浏览器支持 hr 功能的数据问题)

SO 上已经有很多此类问题的示例(如果有兴趣,我可以在评论/讨论中提供)。

最佳答案

当前在 css-display-3 中定义的 display 的多值版本没有实现。

css-display-3 唯一实现的新功能(不包括在它们自己的 CSS 模块中定义的功能,例如 flex 布局、网格布局和 ruby​​ 布局)是 display: contentsdisplay: flow-root,但这些是作为单个关键字值实现的,这意味着实现目前无法识别 display: block flow-root 尽管可以识别 display: flow -root.

考虑到 2017 年 css-display-3 仍在进行重大澄清甚至重写,我不会很快对实现屏住呼吸,特别是因为 display 的当前定义需要重新实现整个属性(即,从单值移动到多值,同时确保现有值和遗留值继续按预期工作并且不会破坏现有站点),更不用说可能对 CSS 布局系统的彻底改造取决于关于它目前是如何实现的,缺点和所有。

关于css - 哪些浏览器支持 CSS 显示属性的多个关键字值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47663945/

相关文章:

javascript - 我可以使用 Jquery 查找元素并将其 CSS 宽度设置为当前宽度 - x 吗?

css - 图像在确定高度的中心位置

html - 用 HTML/CSS 中的图像替换图标

css - 寻找一种制作悬停动画的方法,该动画会立即改变颜色但会慢慢恢复到旧颜色

html - JavaScript 与 CSS

html - 无法理解 span 标签和 css "margin-*"属性

html - 导航栏上的 float Logo ,横幅中有内部阴影 - Bootstrap

html - 如何使标题部分的底部 flex ?

javascript - 在CSS中平均分隔同一行上的两个选择框

javascript - 有没有办法让 div 扩展以覆盖所有可用空间,隐藏它扩展到的所有内容?