Bootstrap hidden-sm-down nie działa

Question

Używam Boostrap 3. Dlaczego <div> z hidden-sm-down jest nadal widoczny podczas zmiany rozmiaru strony na moim laptopie? Chcę ukryć te dwa obrazy na małych urządzeniach, aby mieć inne menu.

<div class="row">     
    <div class="col-md-7 left"> 
     <ul class="row"> 
      <li class="col-md-2"> 
       <a href="">Text</a> 
      </li> 
      <li class="col-md-2"> 
       <a href="">Text</a> 
      </li> 
      <li class="col-md-3"> 
       <a href="">Text</a> 
      </li> 
      <li class="col-md-3"> 
       <a href="">Text</a> 
      </li> 
      <li class="col-md-2"> 
       <a href="">Text</a> 
      </li> 
     </ul> 
    </div> 
    <div class="col-md-1 hidden-sm-down wave"> 
     <img src="img/ondina.png" /> 
    </div> 
    <div class="col-md-3 right"> 
     <ul class="row"> 
      <li class="col-md-6"> 
       <a href="">Text</a> 
      </li> 
      <li class="col-md-6"> 
       <a href="">Text</a> 
      </li> 
     </ul> 
    </div> 
    <div class="col-md-1 hidden-sm-down right-border"> 
     <img src="img/menu-right.png" /> 
    </div> 
</div> 

Answer 1

Jak powiedział Jaqen, jeśli używasz Bootrstrap 3, należy użyć hidden-sm zamiast.

Ponadto, jeśli chcesz ukryć obraz na małym ekranie, musisz dodać hidden-xs.

Oto JsFiddle: DEMO

Answer 2

Możesz wspomnieć użyć Bootstrap 3

Korzystając hidden-sm zamiast hidden-sm-down należącą do Bootstrap 4

Na marginesie:

też wspomnieć:

I wan • aby ukryć te dwa obrazy na małych urządzeniach, aby mieć inne menu.

hidden-sm spowoduje ukrycie elementu na małych ekranach, takich jak iPad. Aby ukryć się na dodatkowych małych ekranach (takich jak Telefony < 768px) dodaj hidden-xs.

przyjrzeć bootstrap Tabela here

Answer 3

Właściwie hidden-sm-down nie będzie działać z BS4

Z BS4, zajęcia użytkowych wyświetlacz są całkowicie zmieniony. Zamiast tego użyj tego formatu;

.d-{breakpoint}-{value} 

Więcej informacji; https://getbootstrap.com/docs/4.0/utilities/display/