Блог

Главная - Вопросы по программированию - Как я могу создать div только для мобильной версии?

Как я могу создать div только для мобильной версии?

#html #css

#HTML #css

Вопрос:

Я хочу создать div в html с изображениями и texx, но он должен отображаться только в мобильной версии, как я могу это сделать? Вот некоторый код.

   /*-- Mobile Design---- */

@media (min-width: 320px) and (max-width: 767px) {
  /* put your css styles in here */
  html,
  body {
    margin-top: 0;
    margin-bottom: 0;
  }
  a.navbar-brand img {
    padding: 0;
    display: flex;
    margin-left: 10px;
    margin-right: auto;
    width: 95%;
    max-width: 200px;
  }
  .header {
    height: 15%;
  }
  .navbar-toggler i {
    font-size: 22px;
    margin-right: 10px;
  }

Ответ №1:

Скройте элемент по умолчанию и показывайте его только тогда, когда он соответствует вашим ограничениям. Например:

 .yourElement {
   display: none;
}

@media (min-width: 320px) and (max-width: 767px) {
   .yourElement {
       display: block;
    }
}