Вопрос:

Bootstrap 4 «скрытый» класс не работает

html css html5 twitter-bootstrap bootstrap-4

4316 просмотра

3 ответа

0 Репутация автора

Я использую Bootstrap v4 с CSS и JS по умолчанию. Я пытаюсь применить классы hidden, hidden-XX-downа также hidden-XX-upк различным элементам div, кнопкам и т. Д. Но это, похоже, ни на что не влияет. Все остальные классы работают, кроме этого.

Вот пример:

<div class="row">

  <div class="col col-10 offset-1 hidden-sm-down">

    <p class="text-primary text-center">Lorem ipsum dolor sit amet.</p>

  </div>

</div>

Я хочу, чтобы абзац был невидимым, когда я изменяю размер окна до меньшей ширины (см-вниз), но он остается видимым и ничего не происходит.

Автор: user9179774 Источник Размещён: 06.01.2018 01:30

Ответы (3)


5 плюса

1973 Репутация автора

Решение

Используйте d-none, d-sm-none, и d-md-noneт.д.

https://getbootstrap.com/docs/4.0/utilities/display/

Для отображения только для md up (скрыть для sm down) используйте:

<div class="d-none d-md-block"></div>
Автор: hayden Размещён: 06.01.2018 03:34

1 плюс

0 Репутация автора

Что ж, использование displayсобственности определенно решило проблему.

Если кому-то интересно, почему hiddenклассы не работают, это очень просто ... Их больше нет в 4-й версии Bootstrap. Вот что вы получаете от просмотра старых обучающих видео.

Автор: user9179774 Размещён: 06.01.2018 04:05

0 плюса

76 Репутация автора

Если у вас уже есть код со скрытым классом, я рекомендую создать его:

.hidden{ 
    display: none;
}

ура

Автор: chatoxz Размещён: 28.05.2019 08:00
Вопросы из категории :
32x32