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

时间:2017-12-05 22:49:11

标签: css css3

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的问题{{3}},但是对于不同的CSS功能。即如果我要使用这个CSS功能对我的用户群有什么影响?(这取决于我的应用程序的用户群,但是任何人都可以自己回答给定有关hr功能的浏览器支持的数据)问题)

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

1 个答案:

答案 0 :(得分:1)

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

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

考虑到css-display-3在2017年仍在进行重大澄清甚至改写,我不会很快屏住实施,特别是因为display的当前定义需要完全重新实现该属性(即,从确保现有值和遗留值继续按预期工作并且不会破坏现有站点的同时从单值转移到多值),更不用说可能根据它的方式对CSS布局系统进行大修。目前正在实施,疣和所有。