Отзывчивость в html и css @media Query ⇐ Html

[Anonymous]

Я пытаюсь создать 3 разных сценария. Небольшой экран, средние экраны и большие экраны. < /P>
@media screen and (max-width: 400px) {
.message-large, .message-med { display: none; }
}

@media screen and (min-width: 401px) and (max-width: 1099px) {
.message-large, .message-small { display: none; }
}
@media screen and (min-width: 1100px) {
.message-small, .message-med { display: none; }
}
< /code>
Как он работает, как кодировано выше, большой сценарий работает на большом дисплее. Средний сценарий работает на среднем дисплее. Средний сценарий работает на небольшом дисплее


small

medium

large
< /code>
P - это просто для устранения проблемы. Ширина и высота IMG SRC будут соответственно изменять размер, пока еще не зашли.

Подробнее здесь: https://stackoverflow.com/questions/652 ... edia-query