可以使用引导程序更改背景颜色

Question

我正在使用引导程序，目前整个页面默认为白色背景。我想知道在引导下使用移动设备时是否可以将背景颜色更改为灰色！比如 "class="col-sm-6" col-xs-6"...

是否可以在 jquery 中编写该代码以自动将背景颜色更改为灰色，当使用移动设备时，如果使用桌面更改，则默认将背景颜色更改为白色。

Answer 1

这绝对是可能的，但根本不需要你使用 jQuery。在 CSS 文件中，只需将 background 属性添加到这些类 - 它可能如下所示：

.col-xs-1, .col-xs-2, .col-xs-3,
.col-xs-4, .col-xs-5, .col-xs-6,
.col-xs-7, .col-xs-8, .col-xs-9,
.col-xs-10, .col-xs-11, .col-xs-12 {
    background: #999;
}

.col-sm-1, .col-sm-2, .col-sm-3,
.col-sm-4, .col-sm-5, .col-sm-6,
.col-sm-7, .col-sm-8, .col-sm-9,
.col-sm-10, .col-sm-11, .col-sm-12 {
    background: #fff;
}

或者，您可以使用媒体查询来更改特定尺寸的正文背景。例如，要仅在屏幕较小时使主体变灰，您可以使用：

body {
    background: #fff;
}

@media all and (max-width: 768px) {
    body {
        background: #999;
    }
}

Answer 2

使用 jQuery：

if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
    // If they are using mobile device
    $("col-sm-6").css("background-color", "Grey");
} else {
    // If they are on a deskop
    $("col-sm-6").css("background-color", "White");
}