Скрыть на мобильных CSS код любой элемент сайта

 Привет ! Сегодня вы узнаете как с помощью простого CSS кода можно скрыть показ любого элемента сайта на мобильных устройствах. Например, вы хотите, чтобы на основном сайте элемент отображался, а на мобильном устройстве не отображался. То есть, при достижении определённого размера экрана, элемент будет автоматически скрываться. Вы можете скрывать таким образом любые элементы сайта, меню, формы, виджеты, веб-элементы и т.д.

Вам нужно будет установить специальный CSS код, в котором нужно будет указать название CSS элемента и максимальный размер экрана. Вот этот CSS код:

 

@media screen and (max-width: 600px) {

#chto_ne_pokazyvat {

visibility: hidden;

display: none;

}

}

 

1 строка – Здесь нужно указать максимальный размер ширины экрана в пикселях, при котором элемент не будет показываться. То есть, при достижении ширины экрана в 600 пикселей элемент будет автоматически скрываться.

2 строка – Здесь нужно указать название элемента для CSS.

Остальные строки оставьте без изменений.

 

Если ваш сайт на WordPress, вам поможет плагин – Simple Custom CSS. В поле плагина вы добавите данный CSS код.

Чтобы узнать CSS название элемента сайта, нажмите правой кнопкой мыши по данному элементу, в открывшемся окне нажмите на вкладку – Просмотреть код. Далее, в правой части экрана у вас откроется исходный код данного элемента. На вкладке “Styles” вы сможете посмотреть название CSS элемента.

 

узнать CSS сайт название

 

После сохранения CSS кода, все изменения вступят в силу.

 

Оцените статью