можно изменить цвет фона с помощью bootstrap

Question

Я использую bootstrap, и в настоящее время полная страница является белым фоном по умолчанию. Мне было интересно, можно ли изменить цвет фона до серого при использовании мобильного под бутстрапом! например, «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"); 
}