使用功能查询定位不支持CSS网格的浏览器

问题描述 投票:1回答:1

如何通过功能查询或媒体查询为不支持当前规范的浏览器可靠地创建CSS网格样式的后备?

根据像this one这样的文章,浏览器会忽略他们无法解析的CSS。因此,我预计负面特征查询即使在不支持它的浏览器上也能工作。例如。 IE11不支持功能查询,所以我希望它忽略这一行并在查询中应用样式:@supports not (display: grid){}。但是,正如你在这个测试中看到的那样,IE11 ignores all the styles inside that query

我找到了IE10 +的媒体查询,但是那个不包括其他不支持网格的浏览器。当然我可以先声明回退样式并使用@supports (grid-area: area)查询覆盖它们,但我更喜欢不需要覆盖的解决方案。

css internet-explorer-11 css-grid browser-feature-detection
1个回答
3
投票

根据像这样的文章,浏览器忽略了他们无法解析的CSS [...]但是,正如您在此测试中看到的那样,IE11忽略了该查询中的所有样式。

嗯,是的由于Internet Explorer本身并不了解功能查询,因此它会忽略@supports not (display: grid)及其中的所有内容,因为它无法理解这意味着什么。就像文章说的那样。

Overriding, i.e. making use of the cascade, is your only option.没有干净的方法这样做。实际情况是,@supports的推出太晚,无法用于区分不支持其前面的功能的浏览器,例如网格布局。

© www.soinside.com 2019 - 2024. All rights reserved.