Описание тега media-queries
Запросы мультимедиа позволяют условное применение стилей CSS на основе типов мультимедиа, таких как экран и печать, а также условий мультимедийных функций, таких как область просмотра, высота и ширина устройства. Они являются частью спецификации W3C CSS3.
1
ответ
css отзывчивый не работает и переписывает мой встроенный стиль
У меня есть сайт WordPress, и я использую загрузчик CSS для всплывающих окон. Пожалуйста, проверьте страницу здесь: http://aboutpubliseek.staging.wpengine.com/test-page/ Когда я уменьшаю ширину браузера менее чем на 770 пикселей, текстовое поле для …
06 май '13 в 10:08
0
ответов
Медиа-запрос для телефонов
У меня есть отзывчивая страница, использующая Bootstrap 4.1. Когда я использую инструменты Google Dev и выбираю iPhone 6, все отображается правильно. Я включил поле, которое показывает выбранный медиа-запрос в левом нижнем углу под "заметками". Goog…
20 авг '18 в 04:29
3
ответа
CSS3 Media Query - ширина контейнера, а не экрана?
Я еще не видел, чтобы этот вопрос задавался здесь, но мне было интересно, если кто-нибудь знает, возможно ли иметь медиа-запрос, основанный на контейнере или родительском элементе, который основан на его ширине. Пользовательский случай для этого, ко…
23 янв '13 в 09:12
2
ответа
Мой Media Query не работает. Включенный метатег; ссылка ссылка ссылка
Код для начинающих здесь. Я пытаюсь создать точки останова для своего сайта для мобильных устройств, чтобы мой сайт правильно помещался на крошечных экранах. Я просто хотел проверить, изменится ли цвет фона, если я уменьшу ширину области просмотра, …
18 мар '16 в 14:17
1
ответ
Gulp postCSS-mixins проблема с медиа-запросами
Я слушаю видеокурс Udemy о gulp и postCSS и делаю то же самое, что и репетитор, но ничего не получается. Мои медиа-запросы смешиваются: @define-mixin atSmall { @media (min-width: 530px) { @mixin-content; } } Мой код postCSS: .large-hero__title { fon…
23 окт '17 в 11:32
1
ответ
Joomla 3 Media Queries игнорируется
Я пытался написать несколько медиа-запросов для шаблона Joomla 3, который я создаю (реплицируется из шаблона Protostar), и, к сожалению, я не добился большого успеха. Я пытаюсь изменить цвет фона, который отображается на обычном рабочем столе, и у м…
17 окт '15 в 23:29
2
ответа
Какие шаги нужно сделать, чтобы дизайн HTML стал адаптивным?
Я только что узнал об адаптивном дизайне. Мой вопрос: какие шаги должен сделать HTML-дизайнер, чтобы адаптировать дизайн? Похоже, что адаптивный дизайн это все об использовании @media запросы и управление потоком элементов на странице, если он измен…
25 авг '15 в 02:15
0
ответов
Переходы flexbox без JavaScript
Я пытаюсь добавить переходы к отзывчивой навигации со свойствами flexbox. Когда окно уменьшается, последний элемент li уменьшается и растет. Могу ли я сделать элемент li, который постепенно уменьшается, не используя JavaScript, только CSS-переходы? …
01 дек '15 в 13:03
1
ответ
Медиа-запросы для iPhone 5 на рабочем столе
Я пытался использовать этот медиа-запрос @media screen and (device-aspect-ratio: 40/71) {}для iPhone 5 адаптивный дизайн. Я вижу эффекты на моем iPhone 5. Но для этого мне нужно каждый раз загружать измененную версию на сервер. Есть ли способ увидет…
16 июл '13 в 12:41
1
ответ
Устройства, не читающие мобильные условные операторы в CSS
Я создаю адаптивный макет, который отлично работает на большинстве форматов, кроме смартфонов с шириной 320 пикселей. Я использовал мультимедийные условия как в CSS, так и в отдельной таблице стилей, и ни один из них, похоже, не работает, почти как …
08 ноя '12 в 15:40
1
ответ
Атрибут размеров для адаптивных точек останова Bootstrap
Я работаю над оптимизацией на своей странице, и все шло гладко, так как у меня появилась идея реализовать srcset а также sizes атрибуты моего <img>, я создаю php функция, которая создает img объект и заливки srcset атрибут с новыми масштабиров…
19 мар '18 в 11:51
1
ответ
Как предварять селектор только в первом матче?
Используя медиа-запросы, я создал навигационную панель, которая сворачивается, а мой логотип находится внизу. С enquire.js я добавлял последний li. Как я могу выполнить prepend только в первом совпадении, чтобы предотвратить переключение одного li, …
26 сен '13 в 20:46
2
ответа
Медиа-запрос ниже 768 пикселей не работает
Я пишу медиа-запрос для веб-страницы и мне удалось написать медиа-запросы для 768 и ниже. Но это не работает должным образом. Я хочу запечатлеть портретные изображения большинства мобильных телефонов ( iphone4, iphone5,iphone3,asus galaxy 7,samsung …
22 июл '18 в 09:48
0
ответов
Программно применить медиа-запрос без изменения размера фрейма
У меня есть маленький iframe, в котором размещается большая страница контента. У iframe есть переполнение: прокрутка, так что вы можете прокручивать и просматривать всю страницу контента, однако, на странице контента css есть медиазапросы, которые з…
10 июл '13 в 22:28
1
ответ
Стилус: строки и переменные в конкатенации
Я не могу объединить строки и переменные в Stylus $screen = 960px $media = 'min-width: ' + $screen @media ({$media}) margin-top: 0 Выход: @media (min-width: $screen) { margin-top: 0; }
26 авг '16 в 17:38
1
ответ
Изменение порта просмотра по нажатию кнопки в HTML5, CSS3, JS
Я хочу изменить вид сайта одним нажатием кнопки в HTML 5 Fluid Grids, например, когда я нажимаю кнопку на мобильном телефоне, мой вид сайта меняется на Мобильный вид, или вы можете сказать, что мой порт просмотра меняется на мобильный и аналогично, …
20 июл '13 в 12:31
2
ответа
Медиа-запросы в CSS не работают между устройствами
Я использовал дополнение Responsive Web Designer в Chrome, чтобы проверить нацеливание на 320 x 480, 480 x 320, 600 x 800, 800 x 600, 768 x 1024 и 1024 x 768. Я использовал: @media screen and (max-width: 480px){ my code } @media screen and (max-widt…
29 июн '16 в 11:38
1
ответ
Safari игнорировать window.matchMedia
Я использую условное окно window.matchMedia, чтобы избежать вставки видео в мобильные устройства. Здесь говорится, что matchMedia будет работать гладко начиная с Safari 9 (я тестирую его), но мой код полностью игнорируется: if ( window.matchMedia("(…
01 мар '16 в 09:47
1
ответ
JQuery для оператора if, чтобы действовать как медиа-запрос CSS
У меня есть этот код JQuery, который прекрасно работает: $(document).scroll(function(){ if ($(this).scrollTop()>175){ // animate fixed div to small size: $('header').stop().animate({ height: 90 },100); } else { // animate fixed div to original si…
29 авг '12 в 12:46
3
ответа
@media ничего не меняет, когда максимальная ширина меньше?
Я пытаюсь создать адаптивный заголовок, который изменяет размер шрифта для разных размеров устройств, но при использовании экрана @Media и (max-width: X px) он не будет вносить никаких изменений, которые я применяю к нему. Мой код @media screen and …
03 ноя '18 в 06:37