Question

最近，我一直在为某人建立一个网站，我对一些浏览器以某种方式呈现网站而其他浏览器呈现另一种方式感到恼火。我决定研究为什么会这样，并发现问题可能在浏览器下面的HTML引擎中。例如，Chrome和Opera（以及大多数（如果不是全部）Chromium浏览器）都使用Blink引擎，它是WebKit引擎的一个分支（源自KHTML引擎）。 Safari使用WebKit。 Internet Explorer使用Trident浏览器;和Edge使用Trident的分支称为EdgeHTML。 Netscape和FireFox使用（或在Netscape的情况下使用，考虑到浏览器已停止使用）Gecko引擎。

考虑到所有这些，是否可以将CSS应用于特定引擎而不是浏览器？或者，当我们尝试使用特定于浏览器的CSS时，这是否已经完成？用户代理字符串的重点是什么（显然是想要模仿其他浏览器的开发人员搞砸了）？

注意，我会从比较这些引擎的相关性来考虑，有3个主要引擎：基于KHTML，基于Trident和Gecko。所以我猜这个问题的答案将至少提供三种不同的方法（每个主要引擎一个）。

Answer 1

即使有可能（使用供应商前缀），维护代码库也是一件痛苦的事。我建议您reset或normalize。

我的重置是重置和标准化的合并。

Answer 2

您可以使用供应商前缀，甚至可以通过带有供应商前缀的支持查询来定位其中一些前缀，例如

@supports (-webkit-appearance:none) {}

Browserhacks有很多方法可供选择。

话虽如此，你真的，真的不应该。维持这将是一场噩梦。

浏览器差异由以下原因引起：

1）不同的用户代理样式（默认浏览器规则）; Normalise或reset将为您处理此问题。

2）某些实验性功能可能仅适用于某些浏览器，或者它们之间有所不同，通常由供应商前缀解决;自动修复程序，例如Prefix Free或Post CSS＆＃39; s Autoprefixer处理完全正常。

3）不同的特征;了解what you can and can't do on each将会带您走很长的路，每当您发现限制时，请确保使用后备甚至是填充。

使用规范化，自动修复程序以及对浏览器功能和后备的正确理解，可以实现99.999％。

请记住，您的项目应该在所有浏览器上工作（或尽可能多，没有人希望在2018年支持IE6 ..）但它可以看起来并且在某些/上有更好的体验最。这是渐进增强和优雅降级的目的。

基于浏览器的引擎应用CSS？

2 个答案: