отзывчивый дизайн - какой тип css он использует?

Question

, когда у меня есть этот код

HTML

<div id = 'bl'> 
</div> 

CSS

#bl { 
    font-size: 12px; 
    Color: #ff0000; 
    ...... 

} 

@media only screen and (min-width: 0px) and (max-width: 799px) 
{ 
    #bl { 
    border: 1px solid #ff0000; 
    } 
} 

это только пример.

какой тип кода он использует, когда размер экрана составляет от 0 до 799? оба или только в медиа-запросе без другого «bl» (font-size ...)?

Answer 1

Стили применяются с подхода сверху вниз. Итак, первый стиль будет считываться и вычисляться, тогда стили медиа-запросов будут перезаписывать стили выше, если экран находится в пределах 0 и 799px.

Answer 2

Оба.

, но если у вас: -

#bl { 
    font-size: 12px; 
    Color: #ff0000; 
    ... 
    border: 2px solid red; 

Тогда border в медиа запросе затем переопределить бы.