Оптимизация кода Изменение стилей с HTML в CSS

199

02 июня 2018, 07:40

Доброе время суток. Такой вопрос касательно верстки и оптимизации. На странице есть блок который отображается только в мобильной версии сайта. На десктопной версии он display:none. Решил что будет не плохой идеей вписать дисплей нон к этому блоку на HTML файле

<div class="mobbody" style="display:none"> 
.... 
</div>

Вопрос следующий: Как перекрыть дисплей нон? Через медиа-запрос(вьюпорт есть) поменять display:none на к примеру display:flex/block и т.п. В прописанном медиа-запросе при размере экрана меньше (условно) 720px стиль не присваивается даже с использованием !important. Возможно я подхожу не с той стороны. Пожалуйста подскажите

Answer 1

правильно пишется !important и это должно сработать. Но это не лучший вариант - писать стили напрямую в html, а также использовать !important не рекомендуется. Лучше пропишите display: none для стандартного изображения в css-файле, а в медиа-запросе для мобильных display: flex/block