Jamie888 Ответов: 1

Media query CSS не работает


Привет, у меня есть CSS-коды, в которых, когда я "восстанавливаю" свой браузер, размер шрифта в строке таблицы также уменьшается. Но когда я попробовал его, он не сработал так, как ожидалось. Ниже приведены мои коды:
CSS
@media all and (max-width: 914px) {
     .ui-Title {
        font-size:12px; 
        padding-top:5px; 
        color:whitesmoke; 
        display:inline-block
    }
}


HTML
<td class="ui-Title" style="vertical-align:middle;font-size:x-large; font-weight:bold">
    MyTitle
</td>


Что я уже пробовал:

1. Попробуйте поискать в Интернете для лучшего понимания использования медиа-класса CSS, но ничего не нашли.

1 Ответов

Рейтинг:
7

Peter Leow

Встроенный CSS всегда будет иметь приоритет над другими размещениями CSS. В вашем случае размер шрифта должен быть 12px для ширины до 914px, как это диктуется медиа-запросом, но встроенный CSS всегда переопределяет его на x-large. Удалите встроенный css и поместите его вместо этого в головной раздел, например

<style>
     .ui-Title {
        vertical-align:middle;font-size:x-large; font-weight:bold
    }

@media all and (max-width: 914px) {
     .ui-Title {
        font-size:12px; 
        padding-top:5px; 
        color:whitesmoke; 
        display:inline-block
    }
}
</style>


учить больше: CSS как это сделать[^]


Karthik_Mahalingam

5

Peter Leow

Спасибо, Картик.

Jamie888

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