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

3

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

例如:

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

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

目前有哪些浏览器支持CSS3的多关键字值用于display,并且这些支持它的浏览器中存在什么怪异行为(如果有的话)?


编辑(回应关闭投票):

不是在寻求推荐或让别人找到外部工具/资源。

问题的意图是帮助我(和其他人)决定是否在我编写的代码中使用此CSS功能,基于它在当前目标平台(浏览器引擎)中的支持情况,而不是帮助我选择浏览器(我已经拥有所有浏览器 - IE,Edge,Chrome,FF,Safari,并且我开发和测试所有浏览器的最新版本)。

基本上,我正在问与flexbox相同的问题this,但针对不同的CSS功能。也就是说,如果我使用这个CSS功能,会对我的用户群体产生什么影响?(这取决于我的应用程序的用户群体,但任何人都可以根据有关问题功能的浏览器支持数据自行回答)

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


2
由于没有浏览器支持 display 的扩展版本 display-insidedisplay-outside,因此没有浏览器支持短版本的多个值。 - Gabriele Petrioli
2
@RoyTinker 实际上整个显示模块添加了多关键字值)都没有被任何浏览器支持(https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Display)。 - Gabriele Petrioli
1
@Gaby aka G. Petrioli:不支持长手写法的实现与它们不支持更新语法无关。几年前,长手写法在草案中被更新语法所取代(一开始就没有实现长手写法是有原因的)。而且,某些浏览器已经部分实现了css-display-3。 - BoltClock
1个回答

1

目前按照css-display-3定义,多值版本的display还没有被实现。

除了在其它CSS模块中定义的特性(如弹性布局、网格布局和ruby布局),css-display-3中仅有的新特性是display: contentsdisplay: flow-root,但这些特性被实现为单个关键字值,这意味着尽管识别了display: flow-root,但目前的实现并不识别display: block flow-root

考虑到截至2017年,css-display-3仍在进行重大澄清甚至重写,我不会对实现抱有太高期望,特别是当前display的定义要求重新实现属性(即从单值转移到多值,同时确保现有值和遗留值继续按预期工作,并且不会因现有站点而出现问题),此外,根据当前的实现方式,CSS布局系统可能需要进行全面改进。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接