当前位置: 首页 > 面试题库 >

是否有CSS媒体查询来检测Windows?

锺离高丽
2023-03-14
问题内容

我想指定两种略有不同的背景颜色,一种用于Mac OS,一种用于Windows。


问题答案:

没有用于指定用于查看网页的操作系统的属性,但是您可以使用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)
}


 类似资料:
  • 主要内容:1. 媒体类型,2. 媒体特性,3. 逻辑操作符,4. 定义媒体查询随着移动设备的快速普及,用户不再只是通过传统的电脑系来浏览 Web 内容,越来越多的用户开始使用各种尺寸的智能手机、平板电脑或者其它设备来浏览 Web 内容,为了确保使用不同设备的用户都能拥有不错的体验就需要用到媒体查询。 媒体查询是 CSS 样式表最重要的功能之一,所谓媒体查询指的就是根据不同的媒体类型(设备类型)和条件来区分各种设备(例如:电脑、手机、平板电脑、盲文设备等),并为它们分别定义不

  • 我想将此条件转换为CSS媒体查询: 编辑: 事实上,我想在这种情况下瞄准Ipad: 因此,如果是任何设备和当前宽度,则应应用CSS 谢谢

  • 问题内容: 在不使用触摸屏设备的情况下,使用媒体查询最安全的方法是什么?如果无法解决,您是否建议使用JavaScript解决方案,例如Modernizr或Modernizr? 问题答案: 我建议使用modernizr并使用其媒体查询功能。 但是,使用CSS时,存在伪类,例如Firefox。您可以使用:-moz-system-metric(touch- enabled)。但是,并非所有浏览器都提供这

  • 问题内容: iPhone 5的屏幕更长,无法捕捉到我网站的移动视图。iPhone 5新增了哪些响应式设计查询,可以与现有iPhone查询结合使用吗? 我当前的媒体查询是这样的: 问题答案: 另一个有用的媒体功能是。 请注意, iPhone 5没有16:9的宽高比 。实际上是40:71。 iPhone <5: iphone 5: iPhone 6: iPhone 6 Plus: iPad:

  • 问题内容: 在JavaScript中,可以使用以下方式检测方向模式: 但是,有没有办法仅使用CSS来检测方向? 例如。就像是: 问题答案: 用于检测屏幕方向的CSS: 媒体查询的CSS定义位于

  • 我试图根据浏览器的最小高度和最小宽度在我的页面上更改CSS,所以我使用这个: 但出于某种原因,这不起作用。我可以检查“最小高度”和“最大宽度”(反之亦然),或者同时检查“最大高度”和“最大宽度”,但检查“最小高度”和“最大宽度”似乎都不起作用。 我应该详细说明这一点:我希望浏览器在最小高度或最小宽度变为真时起作用。仅当两个条件均为真时,使用and运算符才有效。 我做错什么了吗?