- 为 MONTEREY 和 SAFARI 15 更新（2022 年初更新）*
PLEASE PLEASE --如果您遇到问题，并且真的想通过发表评论来获得帮助或帮助他人，请发布您的浏览器和设备（MacBook/iPad/等...同时包含浏览器和操作系统版本号！）
声称没有这些工作是不准确的（实际上甚至不可能。）其中许多并不是真正的“黑客”，而是内置于 Safari 版本中的代码苹果。需要更多信息。我喜欢你来到这里的事实，并且真的希望事情对你有所帮助。
如果您在从此处获取某些内容在您的网站上工作时遇到问题，请通过下面的链接检查测试网站 -- 如果黑客在那里工作，但不在您的网站上，则黑客是不是问题 - 您的网站发生了其他事情，通常只是下面提到的 CSS 冲突，或者可能没有任何工作，但您可能根本没有意识到您实际上并没有使用 Safari。请记住，此信息旨在帮助人们（希望）解决短期问题。
测试地点：
https://browserstrangeness.bitbucket.io/css_hacks.html#safari
和镜子！
https://browserstrangeness.github.io/css_hacks.html#safari
注意：过滤器和编译器（例如 SASS 引擎）需要标准的“跨浏览器”代码——而不是像这样的 CSS hack，这意味着它们会重写，销毁或删除黑客，因为这不是黑客所做的。其中大部分是经过精心设计的非标准代码，仅针对单个浏览器版本，如果被更改则无法工作。如果您希望将其与这些一起使用，您必须在任何过滤器或编译器之后加载您选择的 CSS hack。这似乎是理所当然的，但在那些没有意识到他们通过非为此目的设计的软件运行黑客攻击的人中存在很多困惑。
Safari 自 6.1 版以来发生了变化，正如许多人所注意到的那样。
请注意：如果您在 iOS 上使用 Chrome [现在还有 Firefox]（至少在 iOS 6.1 和更高版本中）并且您想知道为什么似乎没有任何黑客可以将 Chrome 与 Safari 分开，那是因为iOS版Chrome使用的是Safari引擎。它使用 Safari 黑客而不是 Chrome 黑客。更多信息请点击此处：https://allthingsd.com/20120628/googles-chrome-for-ios-is-more-like-a-chrome-plated-apple/ Firefox for iOS 于 2015 年秋季发布。它也响应 Safari Hacks，但没有任何 Firefox 攻击，与 iOS Chrome 相同。
另外：如果您尝试了一种或多种黑客攻击但无法使其正常工作，请发布示例代码（最好是测试页面）-您尝试的黑客攻击以及浏览器（s）（确切版本！）您正在使用以及您正在使用的设备。如果没有这些额外信息，我或这里的任何其他人都无法为您提供帮助。
通常这是一个简单的修复或缺少分号。对于 CSS，如果不仅仅是 CSS 错误，通常是样式表中列出代码的顺序或问题。请在测试站点上测试黑客。如果它在那里工作，这意味着黑客确实适用于您的设置，但这是需要解决的其他问题。这里的人真的很乐意提供帮助，或者至少为您指明正确的方向。
这里有一些技巧供您用于更新版本的 Safari。
你应该先试试这个，因为它涵盖了当前的 Safari 版本并且仅限于纯 Safari：
这个仍然适用于 Safari 13（2020 年初）：
/* Safari 7.1+ */
_::-webkit-full-page-media, _:future, :root .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
要覆盖更多版本，6.1 及更高版本，此时您必须使用下一对 css hack。用于 6.1-10.0 的版本与处理 10.1 及更高版本的版本一起使用。
那么——这是我为 Safari 10.1+ 设计的一个：
双重媒体查询在这里很重要，不要删除它。
/* Safari 10.1+ */
@media not all and (min-resolution:.001dpcm) { @media {
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}}
如果 SCSS 或其他工具集在嵌套媒体查询方面遇到问题，请尝试这个：
/* Safari 10.1+ (alternate method) */
@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) {
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}}
下一个适用于 6.1-10.0 但不适用于 10.1（2017 年 3 月下旬更新）
我通过结合多个其他 hack 经过数月的测试和实验创建了这个 hack。
注意：像上面一样，双重媒体查询并非偶然——它排除了许多无法处理媒体查询嵌套的旧浏览器。 -- 一个'and's 后面的空格也很重要。毕竟，这是一个 hack……并且是目前唯一适用于 6.1 和所有更新的 Safari 版本的。另请注意，如下面的 cmets 中列出的，hack 是非标准 css，必须在过滤器之后应用。 SASS 引擎等过滤器将重写/撤消或完全删除它。
如上所述，请检查我的测试页面以查看它是否按原样运行（无需修改！）
这里是代码：
/* Safari 6.1-10.0 (not 10.1) */
@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
{ @media {
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}}
有关“特定于版本”的更多 Safari CSS，请继续阅读下文。
/* Safari 11+ */
@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) and (stroke-color:transparent) {
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}}
一个用于 Safari 11.0：
/* Safari 11.0 (not 11.1) */
html >> * .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
一个用于 Safari 10.0：
/* Safari 10.0 (not 10.1) */
_::-webkit-:host:not(:root:root), .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
稍作修改适用于 10.1（仅限）：
/* Safari 10.1 */
@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) and (not (stroke-color:transparent)) {
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}}
Safari 10.0（非 iOS 设备）：
/* Safari 10.0 (not 10.1) but not on iOS */
_::-webkit-:-webkit-full-screen:host:not(:root:root), .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
Safari 9 CSS 技巧：
一个简单的支持 Safari 9.0 及更高版本的功能查询破解：
@supports (-webkit-hyphens:none)
{
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}
Safari 9.0 及更高版本的简单下划线破解：
_:not(a,b), .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
Safari 9.0 及更高版本的另一个：
/* Safari 9+ */
_:default:not(:root:root), .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
还有另一个支持功能查询：
/* Safari 9+, < 13.1 */
@supports (-webkit-marquee-repetition:infinite) and (object-fit:fill) {
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}
一个用于 Safari 9.0-10.0：
/* Safari 9.0-10.0 (not 10.1) */
_::-webkit-:not(:root:root), .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
Safari 9 现在包含功能检测，因此我们现在可以使用它...
/* Safari 9 */
@supports (overflow:-webkit-marquee) and (justify-content:inherit)
{
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}
现在只针对 iOS 设备。如上所述，由于 iOS 上的 Chrome 植根于 Safari，因此它当然也适用于 Safari。
/* Safari 9.0 (iOS Only) */
@supports (-webkit-text-size-adjust:none) and (not (-ms-ime-align:auto))
and (not (-moz-appearance:none))
{
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}
一个适用于 Safari 9.0+ 但不适用于 iOS 设备：
/* Safari 9+ (non-iOS) */
_:default:not(:root:root), .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
还有一个适用于 Safari 9.0-10.0 但不适用于 iOS 设备：
/* Safari 9.0-10.0 (not 10.1) (non-iOS) */
_:-webkit-full-screen:not(:root:root), .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
以下是区分 6.1-7.0 和 7.1+ 的技巧
为了获得正确的结果，这些还需要多种技巧的组合：
/* Safari 6.1-7.0 */
@media screen and (-webkit-min-device-pixel-ratio:0) and (min-color-index:0)
{
.safari_only {(;
color:#0000FF;
background-color:#CCCCCC;
);}
}
既然我已经指出了阻止 iOS 设备的方法，这里是针对非 iOS 设备的 Safari 6.1+ hack 的修改版本：
/* Safari 6.1-10.0 (not 10.1) (non-iOS) */
@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
{ @media {
_:-webkit-full-screen, .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}}
使用它们：
<div class="safari_only">This text will be Blue in Safari</div>
通常 [就像在这个问题中一样] 人们询问 Safari hack 的原因是
主要是指将其与 Google Chrome 分开（同样不是 iOS！）
发布替代方案可能很重要：如何单独定位 Chrome
也来自 Safari，所以我在这里为您提供，以备不时之需。
这里是基础知识，再次查看我的测试页面以了解许多特定版本的 Chrome，但这些都涵盖了 Chrome。 Chrome 是 45 版，Dev 和 Canary 版本目前最高到 47 版。
我在 browserhacks 上使用的旧媒体查询组合仍然适用于 Chrome 29+：
/* Chrome 29+ */
@media screen and (-webkit-min-device-pixel-ratio:0) and (min-resolution:.001dpcm)
{
.chrome_only {
color:#0000FF;
background-color:#CCCCCC;
}
}
@supports 功能查询也适用于 Chrome 29+……我们在下面用于 Chrome 28+ 的修改版本。 Safari 9、即将到来的 Firefox 浏览器和 Microsoft Edge 浏览器都没有与这个一起使用：
/* Chrome 29+ */
@supports (-webkit-appearance:none) and (not (overflow:-webkit-marquee))
and (not (-ms-ime-align:auto)) and (not (-moz-appearance:none))
{
.chrome_only {
color:#0000FF;
background-color:#CCCCCC;
}
}
以前，Chrome 28 及更高版本很容易定位。这是我在看到它包含在其他 CSS 代码块中（最初不是作为 CSS hack）并意识到它的作用后发送给 browserhacks 的，因此我出于我们的目的提取了相关部分：
[ 注意：] 下面这个较旧的方法现在描绘了没有上述更新的 Safari 9 和 Microsoft Edge 浏览器。即将到来的 Firefox 和 Microsoft Edge 版本在其编程中增加了对多个 -webkit- CSS 代码的支持，Edge 和 Safari 9 都增加了对 @supports 功能检测的支持。 Chrome 和 Firefox 之前包含 @supports。
/* Chrome 28+, Now Also Safari 9+, Firefox, and Microsoft Edge */
@supports (-webkit-appearance:none)
{
.chrome_and_safari {
color:#0000FF;
background-color:#CCCCCC;
}
}
Chrome 版本 22-28 的块（如果需要支持旧版本）也可以通过我在上面发布的 Safari 组合黑客的扭曲来定位：
/* Chrome 22-28 */
@media screen and(-webkit-min-device-pixel-ratio:0)
{
.chrome_only {-chrome-:only(;
color:#0000FF;
background-color:#CCCCCC;
);}
}
NOTE: If you are new, change class name but leave this the same-> {-chrome-:only(;
就像上面的 Safari CSS 格式化技巧一样，这些可以按如下方式使用：
<div class="chrome_only">This text will be Blue in Chrome</div>
所以你不必在这篇文章中搜索它，这里又是我的现场测试页面：
https://browserstrangeness.bitbucket.io/css_hacks.html#safari
[或镜子]
https://browserstrangeness.github.io/css_hacks.html#safari
测试页面还有很多其他的，特别是基于版本的进一步
帮助您区分 Chrome 和 Safari，以及针对 Firefox、Microsoft Edge 和 Internet Explorer Web 浏览器的许多 hack。
注意：如果某些东西不适合您，请先检查测试页面，但请提供示例代码和您尝试的哪些 hack，以便任何人为您提供帮助。