有一种方法可以根据您所使用的浏览器的性质来做到这一点，一点演绎推理和一些技巧......并不是所有的东西都能做到这一点，但有一些您可以仅使用 CSS 用于操作系统定位。当然，脚本提供了更多选择。这反映了我为确保准确性而进行的大约 6 个月的研究和工作，如下文所述。
目前我不知道有什么方法可以用 Chrome 做到这一点，而且我还没有研究过 Opera，特别是现在它使用与 Chrome 大部分相同的方法。 Chrome 直到版本 3 才发布适用于 Mac 的版本。同样对于 Mac，Google 已发布声明，Chrome 49 之后将不再支持 OS X 10.6-10.8，因此 Chrome 50 及更高版本将指示 Mac OS X 10.9 (Mavericks) 或较新。
不过，Firefox、Internet Explorer 和 Safari 有更好的选择。
Firefox 4 及更新版本可以检测到正在使用 Windows 主题，因此即使是旧版本的 Firefox 也至少会检测您是否正在使用 Windows。我不久前创建了这个，今天再次测试了这个：
@media screen and (-moz-windows-theme) {
.windows {
color:red;
}
}
出于同样的原因，该方法适用于除 Windows 之外的任何操作系统，同样适用于 Firefox 4 及更高版本：
@media not screen and (-moz-windows-theme) {
_:-moz-ui-valid, .nonwindows {
color:red;
}
}
-moz-os-version 已添加到 Firefox 25 媒体查询中，但根据 mozilla 文档，只有几个选项https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries
操作系统：windows-xp | Windows Vista | Windows-win7 | windows-win8 | windows-win10
因此，该设置仅适用于版本 >= 25 的现代 Firefox 浏览器。在发布此更新时，Firefox 的版本为 35。
@media screen and (-moz-os-version:windows-xp) {
.windows,.winxp {
color:red;
}
}
@media screen and (-moz-os-version:windows-vista) {
.windows,.vista {
color:red;
}
}
@media screen and (-moz-os-version:windows-win7) {
.windows,.win7 {
color:red;
}
}
@media screen and (-moz-os-version:windows-win8) {
.windows,.win8 {
color:red;
}
}
@media screen and (-moz-os-version:windows-win10) {
.windows,.win10 {
color:red;
}
}
Microsoft 的 Edge 浏览器（以前称为 Spartan）目前仅在 Windows 10 中可用。要检测它：
/* Microsoft Edge Browser */
@supports (-ms-ime-align:auto) {
.windows,.win10 {
color:red;
}
}
注意：之前的 -ms-accelerator:true 方法在新版本中已更改，因此可以用于针对特定版本的 Edge，但不是所有版本。 -ms-ime-align:auto 在 2017 年仍然适用于所有这些。
还有一些方法可以检测 Macintosh 计算机。
Firefox >= 24 为 OS X 10.7 Lion 及更高版本引入了新的滚动条覆盖方法，可通过媒体查询检测到：
@media screen and (-moz-overlay-scrollbars) {
.mac,.mac10_7up {
color:red;
}
}
Firefox >= 25 也有一种方法来检测 Mac OS X，因为他们在版本 25 中添加了对 OS X 字体平滑的支持：
@supports (-moz-osx-font-smoothing:auto) {
.mac,.mac10_6up {
color:red;
}
}
由于 @media 查询和 @supports 过滤器可以相互嵌套，因此现在可以进行以下操作 - 为了将 Firefox 24 及更高版本定位到 JUST OS X 10.6 Snow Leopard：
@supports (-moz-osx-font-smoothing:auto) {
@media not all and (-moz-overlay-scrollbars) {
.mac,.mac10_6 {
color:red;
}
}
}
Firefox 17 及更高版本仅支持 Mac OS X 10.6+（Snow Leopard 及更高版本），因此如果您有上述任何 OS X CSS 规则的结果，则您使用的不是 OS X 10.5 或更早版本。 (https://en.wikipedia.org/wiki/History_of_Firefox#Version_17_.28ESR.29 https://en.wikipedia.org/wiki/History_of_Firefox#Version_17_.28ESR.29)
相反，在 Firefox 25+ 中，可以再次否定 OS X（10.6 及更高版本）——由于 10.5 及更早版本不支持此版本的 Firefox，这意味着这根本不是 Mac：
@supports (-moz-appearance:none) and (background-attachment:local)
and (not (-moz-osx-font-smoothing:auto)) {
.nonmac {
color:red;
}
}
从 Firefox 49 开始，Firefox 不再支持 10.9 版本之前的 Mac OS X，因此，如果您使用的是 48 或更低版本，则必须是 OS X 10.8 或更早版本，或者如果您使用的是 17-48 之间的版本，则必须是 OS X 10.6-10.8出于同样的原因。
当我写这篇文章时，iOS（iPad 和 iPhone）还没有 Firefox 版本，因此具有 OS X 字体平滑功能的 Firefox 目前仅适用于 Mac 电脑，不适用于 Apple 移动设备。与 iOS 版 Chrome 一样，iOS 版 Firefox 使用 Safari 引擎，因此在 iPad 和 iPhone 上使用 Safari hacks。因此，它们都可以作为 Safari 的目标，但实际上并不是他们所说的那样。
通过同时否定两者，我们有一种方法来瞄准剩下的东西：Android/Linux，同样是 Firefox 25 及更新版本：
@supports (-moz-appearance:none) and (background-attachment:local)
and (not (-moz-osx-font-smoothing:auto)) {
@media not screen and (-moz-os-version) {
.lindroid {
color:red;
}
}
}
如果您使用的是 Internet Explorer 版本 6 或更高版本（Windows XP 和更高版本），那么无论如何您显然都在使用 Windows。这也可以通过不止一种方式来确定。
条件注释在 Internet Explorer 9 之前一直存在于 Windows 中，因此可以使用它们来收集更多信息：
这只能检测到你有windows，但不一定是版本，因为Internet Explorer 6-9只存在于windows平台上。目前，Internet Explorer 11 是当前版本，因此不会检测 10 和 11，而是检测 9 及之前的版本：
<!--[if (gte IE 6)&(lte IE 9)]><style type="text/css">
.windows {
color:red;
}
</style><![endif]-->
Internet Explorer 6 仅存在于 Windows XP 中，或者现在已不再使用的旧版 Windows 版本中，因此这适用于该版本：
<!--[if (IE 6)]><style type="text/css">
.windows,.winxp {
color:red;
}
</style><![endif]-->
Internet Explorer 7 存在于 Windows XP Vista 中，但是当您单击 Internet Explorer 8 或更高版本中的兼容模式选项时，通常也会模拟 Internet Explorer 7。
如果您使用的是 Internet Explorer 10 或更高版本（因此您使用的是 Windows 7 或 8），则此方法适用。
@media screen and (-ms-high-contrast:active), (-ms-high-contrast:none) {
.windows {
color:red;
}
}
我亲自制作的作品之一可以检测 Internet Explorer 11 或更高版本，它适用于 Windows 7 和更高版本（最高可达 8.1）。
_:-ms-fullscreen, :root .windows {
color:red;
}
如果您不想使用 Internet Explorer 条件注释而是希望使用媒体查询，那么这些确实存在：
要检测 Internet Explorer 6-7（因此 Windows XP 及更早版本直至 Windows 7），此方法有效：
@media screen\9
{
.windows {
color:red;
}
}
这是我为 Internet Explorer 9 创建的，因为不存在。 （所以赢得 7 或赢得 Vista）
@media screen and (min-width:0\0) and (min-resolution:.001dpcm)
{
.windows {
color:red;
}
}
这会检测 Internet Explorer 8（因此是 windows XP-windows 7）
@media \0screen
{
.windows {
color:red;
}
}
去年，我从其他各个部分制作了这个媒体查询，它可以处理 Safari 6.1 及更高版本。在本文发布时，Safari 是版本 7。 Mac 和移动设备（例如基本 Android 浏览器）将以这种方式进行检测：
@media screen and (-webkit-min-device-pixel-ratio:0) and (min-color-index:0)
{
.mac_or_mobile {(;
color:red;
);}
}
这是检测大多数较新 Mac 的更好方法，不包括 iPad（或 Android）等移动设备 - 同样，它适用于 Safari 6.1 及更高版本，因此它是 Mac...：
@media screen and (-webkit-max-device-pixel-ratio:1) and (min-color-index:0)
{
.mac_osx {(;
color:red;
);}
}
如果您想要手机，这适用于最近的高清手机：
@media screen and (-webkit-min-device-pixel-ratio:1.1) and (min-color-index:0)
{
.retina {(;
color:red;
);}
}
我在这里有更多关于手机和平板电脑的信息： https://jeffclayton.wordpress.com/2014/07/22/css-for-hi-def-mobile-retina-devices/https://jeffclayton.wordpress.com/2014/07/22/css-for-hi-def-mobile-retina-devices/ https://jeffclayton.wordpress.com/2014/07/22/css-for-hi-def-mobile-retina-devices/和这里： https://jeffclayton.wordpress.com/2014/07/28/css-hack-anything-but-ios/https://jeffclayton.wordpress.com/2014/07/28/css-hack-anything-but-ios/ https://jeffclayton.wordpress.com/2014/07/28/css-hack-anything-but-ios/
Mac 确实有一段时间有 Internet Explorer，但在 5.5 版之后就没有再制作新版本。
Windows 也有一段时间也有 Safari，但在第 5 版之后就没有再制作更新的版本。大多数 Windows 用户从不使用 Safari，因此当检测到 Safari 时，您通常可以排除 Windows。
如果将上述所有样式包含到文档中，下面的 div 将反映上面样式的结果：
Per Firefox and Internet Explorer/Edge:
<div class="windows"> If this is Windows this is red </div>
<div class="winxp"> If this is Windows XP or older this is red </div>
<div class="win10"> If this is Windows 10 this is red </div>
Per Firefox:
<div class="vista"> If this is Windows Vista this is red </div>
<div class="win7"> If this is Windows 7 this is red </div>
<div class="win8"> If this is Windows 8 this is red </div>
<div class="nonwindows"> If this is NOT Windows this is red </div>
<div class="nonmac"> If this is NOT Mac OS X this is red </div>
<div class="mac"> If this is Mac OS X this is red </div>
<div class="mac10_7up"> If this is Mac OS X 10.7 or newer this is red </div>
<div class="mac10_6up"> If this is Mac OS X 10.6 or newer this is red </div>
<div class="mac10_6"> If this is Mac OS X 10.6 only this is red </div>
<div class="lindroid"> If this is Linux or Android this is red </div>
Per Safari:
<div class="mac_osx"> If this is a Mac using Safari
(desktop or laptop computer) this is red (includes old mobile devices but not before iOS 6) </div>
<div class="mac_or_mobile"> If this is a Mac or a mobile device using Safari
(Android or iPad/iPhone) this is red </div>
<div class="retina"> If this is a hi-def mobile device using Safari
(Android or iPad/iPhone) this is red </div>
关于检测的附加说明...
基于 Internet Explorer/Edge 的 Windows 版本（为了便于参考）：
As stated above if you detect Internet Explorer 6, you are using XP (or older Win)
If you detect Internet Explorer 7-8, you are using Windows XP, Vista, or Windows 7
If you detect Internet Explorer 9 you are using Windows Vista or Windows 7
If you detect Internet Explorer 10 you are using Windows 7 or Windows 8.0
If you detect Internet Explorer 11 you are using Windows 7 or Windows 8.0/8.1 or Windows 10
If you detect Microsoft Edge you are using Windows 10
Windows 10 是本文发布时的当前 Windows 版本。
出于历史兴趣，如果您确实愿意，您实际上可以使用我发现的旧技巧来确定 Mac 上的 Internet Explorer 5 或更低版本：
/*\*//*/ .mac_internet_explorer { color:red; } /**/
Mac 版本的 Internet Explorer 仅适用于旧的 PowerPC Mac，而不适用于 Intel 型号。
