2015-03-23 3 views
0

У меня есть другой заголовок, который я хочу сделать для разных экранов. У меня возникли проблемы с получением запросов @media, которые работают или понимают их. Прямо сейчас у меня слоган жестко закодирован. Для широких экранов у меня изображение больше. И меньше другого. Я не могу заставить маленькое изображение уйти на широкий экран.проблемы со средствами массовой информации Wordpress

Вот мои медиазапросы

  • @media only screen and (min-width: 768px) and (max-width: 960px)
  • @media only screen and (max-width: 960px)
  • @media only screen and (max-width: 767px)

@media only screen and (max-width: 479px) { #slogan{ display: none !important; } #slogan2 { float: none; background: url (http://www.wpcreations.net/test/wp-content/uploads/2015/03/mobile_logo.gif) no-repeat !important; } } Для меньшего размера экрана я имею лозунг <div> шоу, но я думаю, что для другой ширины она не следует показывать, но, может быть. Пожалуйста, используйте Firefox и сделайте экран больше и меньше, чтобы увидеть проблемы и как скрыть большое изображение, а затем показать немного или наоборот.

+0

Пожалуйста, очистите свой код –

ответ

0

Это потому, что вы поместили код, чтобы скрыть меньший лозунг внутри min-width: 768 И max-width: 960. По умолчанию div div будет иметь атрибут отображения «block». Поскольку вы показываете только «нет» между 768px и 960px, на больших экранах это отображается. Переместите код #slogan { display: none; }, прежде всего ваши другие медиа-запросы, просто используйте его как обычную декларацию CSS и ее исправить.

Смежные вопросы