2017-01-02 9 views
0

Я с помощью WordPress на этом проекте, и это мой класс строки кода в моем файле PHP:Как скрыть содержимое div в php для мобильных устройств?

<div class="footer-banner"> 

То, как я пытался скрыть от мобильных устройств, но не работает, и на самом деле я не знаю, почему:

@media screen and (max-width: 960px) { 

div.footer-banner { display: none; } 

} 
+0

Попробуйте использовать Главное в медиа-запросе, как я сделал здесь @media экран и (макс-ширина: 960px) { div.footer-баннер {дисплей:! Ни один важный; } } – AmitV

+0

Попробуйте: '@media (max-width: 960px) {div.footer-banner {display: none; }} 'Также проверьте, нет ли правил, влияющих на' .footer-banner' после вашего правила '@ media'. – Hokusai

+0

Чтобы получить имя класса в файле css, вы должны использовать «.». оператор. ваши последние два блока медиа-запросов ошибочны, поскольку вы использовали «#» для div, а также имя класса. – AmitV

ответ

1

Попробуйте что-нибудь подобное.

Если у вас есть Boostrap, то вы можете использовать класс boostrap hidden-sm для скрытых div в мобильном режиме.

@media (max-width: 1199px) { 
} 

@media (max-width: 991px) { 
} 

@media (max-width: 767px) { 
    .footer-banner{display:none} 
} 
+0

Неверный .css-файл Я добавил этот код, должен добавить верхний код в bootstrap.css ... –

0

Для мобильных устройств, которые необходимо использовать медиа-запрос, потому что мобильные устройства занимает ширину примерно между 320px до 480px

@media screen and (max-width: 481px) { 
.footer-banner { display: none; } 
} 

и удалить другие запросы средств массовой информации.

Благодаря

0

ли вы установили мета окна просмотра в HTML <head> правильно?

<meta name="viewport" content="width=device-width">