Бутстрап 3: Скрыть элементы на устройствах меньшего размера, чем таблетки без использования 2 классов начальной загрузки

Question

Можно ли скрыть элемент на устройствах меньше, чем таблетки (col-sm-* & col-xs-*) без использования 2 начальной загрузки классов visible-md visible-lg на элементе с бутстрапе 3 можно заранее определенных классов:

<div class="col-sm-8 visible-md visible-lg"> ..</div> 

Благодаря DKJ

Answer 1

Да, забыть о классах и просто сделать:

.your-selector { 
    display: none; 
} 
@media(min-width: 992px) { 
    .your-selector { 
    display: block; 
    } 
} 

Используйте классы для более конкретных случаев, когда это действительно необходимо.

Answer 2

В соответствии с documentation видимые (и скрытые) классы показывают только размер этого медиа-запроса, если вы хотите расширить классы, чтобы вы могли сделать это с помощью одного класса, который вы можете, но это потребует, чтобы вы базовое понимание медиа-запросов и css3 (sass или less, если вы используете препроцессор).

Вы можете просто использовать класс hidden-xs, чтобы скрыть его под диапазоном запросов , так как @Vijay Maheriya сказал в комментариях.

Answer 3

Если у вас есть только один (или несколько) элемент (ы), который вы хотите скрыть/показать выборочно, то, вероятно, проще всего использовать оба класса. Если вы делаете это с несколькими элементами и предпочитаете очищать свою разметку, вы можете просто создать свой собственный класс для этого. Например:

.hidden-sm-xs { 
    display: none; 
} 

@media screen and (min-width: 992px) { 
.hidden-sm-xs { 
    display: block; 
    } 
} 

Если вы изменяли изломов Bootstrap, обратите внимание, что вам нужно будет настроить 992px, чтобы соответствовать вашей пользовательской точки останова. Как отмечали другие, вы можете просто переопределить один из существующих классов Bootstrap, но я предпочитаю просто создавать новый ... Это то же количество CSS, и вы никогда не знаете, когда вам действительно может понадобиться hidden-xs, чтобы скрыть только самые маленькие экраны, как и предполагалось. Но если вы его переопределили, вам придется много рефакторинга.