我在 Mac 上设计网站时一直遇到问题。当我的客户在 PC 上查看时,我在笔记本电脑显示屏上看到的颜色总是完全不同。我为在办公室环境中同时使用 Mac 和 PC 的客户设计了网站,因此无论他们使用什么计算机,颜色看起来相似(如果不相同)是很重要的。
我知道有针对浏览器特定属性的 CSS hacks..但是有没有办法根据浏览者使用的平台更改网站的背景颜色..PC、Mac 等
我知道这似乎有点牵强,因为即使是相同的平台也可能使用不同的显示器、校准等。在黑暗中拍摄,但希望有一个创造性的答案!
编辑: 以下是我如何将建议的脚本添加到网站的头部......我的 Javascript 经验非常有限。我有 jquery ..
<script>
var OSName="Unknown OS";
if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows";
if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS";
if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX";
if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux";
console.log('Your OS: '+OSName);
if (navigator.appVersion.indexOf("Win")!=-1)
{
$(body).css('background','#333');
} else {
$(body).css('background','#000'); // this will style body for other OS (Linux/Mac)
}
</script>
最佳答案
检查这个(来自 here ):
没有指定用于查看网页的操作系统的属性,但您可以使用 javascript 检测它,这里是检测操作系统的一些示例:
var OSName="Unknown OS";
if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows";
if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS";
if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX";
if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux";
console.log('Your OS: '+OSName);
明白了吗?现在您可以使用 document.write
为特定操作系统编写下载样式表。 :)
另一个例子,我假设你正在使用 jquery。
if (navigator.appVersion.indexOf("Win")!=-1)
{
$(body).css('background','#333');
} else {
$(body).css('background','#000'); // this will style body for other OS (Linux/Mac)
}
关于css - 是否有 CSS 方法/hack 来指定基于平台的背景颜色(即 mac vs pc),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21336814/