Bootstrap：使CSS规则仅适用于桌面版本

我使用引导来创建应用程序的桌面和移动版本。Bootstrap：使CSS规则仅适用于桌面版本

我想让桌面版在左上角有一个小图像，几乎就像水印一样，不会影响任何其他元素的定位，所以我在背景图上使用了主体

body 
{ 
    background-image: url("../image/logo.png"); 
    background-repeat: no-repeat; 
}

但是，我不希望这显示在移动版本上。

如何停止影响移动版本的CSS规则？

来源

2013-03-12 user2162295

你可能会想使用一个类对身体标记：

body.desktop 
{ 
    background-image: url("../image/logo.png"); 
    background-repeat: no-repeat; 
} 

<body class="desktop"> 
... 
</body>

你也可以使用media queries删除图像的屏幕尺寸小。将需要在这种情况下，没有体类：

@media only screen and (max-device-width: 480px) { 
    body {background-image: none;} 
}

来源

2013-03-12 18:33:21 isherwood

我甚至不知道为什么你会在这里推荐一类，你怎么能指望得到应用这个班？在使用媒体查询时，最好在'（min-width：X）'时应用bg，而不是全局应用它，并在事后将其删除。这样少用CSS。很少有很好的理由在'min-width'上使用'min-device-width'（这与max-*相同）。 – cimmanon 2013-03-12 18:40:24

我不明白你的身体课的问题。至于媒体查询，这是一个可以修改的通用示例。随意编辑。 – isherwood 2013-03-12 18:42:09

谢谢你们，这个伎俩。 '@media唯一的屏幕和（最小宽度：768px）{ 机身{\t background-image：url（“../ image/logo.png”）; background-repeat：no-repeat; } }' – user2162295 2013-03-12 18:51:17

Bootstrap：使CSS规则仅适用于桌面版本

回答

相关问题