 
  
   
  
   
  
  div {font-size:14px}
@media (max-width: 767.98px) {
  div {background-color: #f00}
}
@media (min-width: 768px) {
  div {background-color: #000}
}div {font-size:14px; background-color: #f00;}
@media (min-width: 768px) {
  div {background-color: #000}
}Особенно полезный такой подход в ситуации, когда мы добавляем какой-нибудь класс с помощью jsэто очень вредный подход. Когда открываешь js и в нем прописаны условия сразу видно, что делает скрипт. А так ты его открываешь и думаешь, что пошло не так, лезешь в тулзы смотришь, класс есть но стили перебиты, идешь в css. Довольно геморно не так ли?
 
  
   
  
  