Адаптивный веб-дизайн (RWD) - это подход к веб-дизайну и разработке, направленный на создание сайтов, обеспечивающих оптимальное взаимодействие с широким спектром устройств в зависимости от размера экрана, платформы и ориентации.
Мне трудно разобраться с масштабированием шрифтов. В настоящее время у меня есть этот сайт с телом font-size100%. 100% чего хотя? Это, кажется, вычислить в 16 пикселей. У меня сложилось впечатление, что 100% будет как-то относиться к размеру окна браузера, но, видимо, не потому, что это всегда 16...
Я хочу создать, divкоторый может изменить свою ширину / высоту при изменении ширины окна. Существуют ли какие-либо правила CSS3, которые позволили бы изменить высоту в соответствии с шириной при сохранении соотношения сторон ? Я знаю, что могу сделать это с помощью JavaScript, но я бы предпочел...
В чем разница между col-lg-*, col-md-*и col-sm-*в Twitter
Я запутался по поводу различных опций в сетке начальной загрузки Twitter , и как они идут вместе. Для начала, вы можете иметь обычную фиксированную containerили a container-fluid. Тогда либо можно включить либо обычный row, либо текучий ряд row-fluid. То есть у вас может быть фиксированный...
Я создал сайт, используя сетку Zurb Foundation 3 . Каждая страница имеет большое h1: body { font-size: 100% } /* Headers */ h1 { font-size: 6.2em; font-weight: 500; } <div class="row"> <div class="twelve columns text-center"> <h1> LARGE HEADER TAGLINE </h1> </div>...
В каждом учебном руководстве по разработке адаптивных веб-сайтов рекомендуется использовать display:noneсвойство CSS, чтобы скрыть содержимое от загрузки в мобильных браузерах, чтобы веб-сайт загружался быстрее. Это правда? Не display:noneзагружает изображения или все еще загружает контент в...
Глядя через начальную загрузку, кажется, что они поддерживают свертывание элементов меню для небольших экранов. Есть ли что-то похожее для других предметов на странице? Например, у меня наряду с таблетками навплывало право. На маленьком экране это вызывает проблемы. Я хотел бы, по крайней мере,...
Я хочу, чтобы кнопка занимала всю ширину столбца, но возникают трудности ... <div class="span9 btn-block"> <button class="btn btn-large btn-block btn-primary" type="button">Block level button</button> </div> Как сделать кнопку шириной...
Предположим, у меня есть скрипт гистограммы, который строит графику SVG 960 500. Как сделать так, чтобы изменение размера графической ширины и высоты было динамичным? <script> var n = 10000, // number of trials m = 10, // number of random variables data = []; // Generate an Irwin-Hall...
В настоящее время, когда ширина браузера падает ниже 768 пикселей, панель навигации переходит в свернутый режим. Я хочу изменить эту ширину на 1000 пикселей, поэтому, когда размер браузера ниже 1000 пикселей, панель навигации переходит в свернутый режим. Я хочу сделать это без использования LESS, я...
У меня есть веб-сайт (g-floors.eu), и я хочу, чтобы фон (в css я определил bg-изображение для контента) также был адаптивным. К сожалению, я действительно не имею ни малейшего представления о том, как это сделать, кроме одной вещи, о которой я могу думать, но это довольно обходной путь. Создание...
(Это вопрос, состоящий из нескольких частей, я сделаю все возможное, чтобы суммировать сценарий.) В настоящее время мы создаем адаптивное веб-приложение (программа чтения новостей), которое позволяет пользователям перемещаться между содержимым с вкладками, а также осуществлять вертикальную...
IE8 не поддерживает следующий медиа-запрос CSS: @import url("desktop.css") screen and (min-width: 768px); Если нет, какой альтернативный способ написания? То же самое отлично работает в Firefox. Есть проблемы с кодом ниже? @import url("desktop.css") screen; @import url("ipad.css") only screen and...
На этот вопрос есть ответы на Переполнение стека на русском : Сетка из адаптивных (отзывчивых) квадратов Мне интересно, как бы я мог создать макет с адаптивными квадратами . Каждый квадрат будет иметь вертикально и горизонтально выровненный контент. Конкретный пример показан ниже ......
Я читал этот пост, посвященный стеку, под названием «Можете ли вы сделать iFrame отзывчивым?», И один из комментариев / ответов привел меня к этому jfiddle. Но когда я попытался реализовать HTML и CSS, чтобы удовлетворить свои потребности, у меня не было таких же результатов / успеха. Я создал свою...
Я тестирую панель навигации Bootstrap, и у меня есть демонстрационный веб-сайт. Когда я изменяю размер браузера на рабочем столе, все работает нормально, включая панель навигации, которая становится сворачиваемым меню с небольшим значком вверху, который я могу щелкнуть, чтобы увидеть больше кнопок...
У меня есть следующий код, который устанавливает контейнер, высота которого изменяется в зависимости от ширины при изменении размера браузера (для сохранения квадратного соотношения сторон). HTML <div class="responsive-container"> <div class="dummy"></div> <div...
IPhone 5 имеет более длинный экран, и он не улавливает мобильный вид моего сайта. Каковы новые адаптивные дизайнерские запросы для iPhone 5 и можно ли их комбинировать с существующими запросами iPhone? Мой текущий медиа-запрос таков: @media only screen and (max-device-width: 480px)...
Мне нужно создать отзывчивую страницу с помощью начальной загрузки, разместив div в центре страницы, как в приведенном ниже
У меня есть видео с YouTube, встроенное на наш веб-сайт, и когда я уменьшаю экран до размеров планшета или телефона, он перестает уменьшаться примерно до 560 пикселей в ширину. Это стандарт для видео на YouTube или я могу добавить что-нибудь в код, чтобы уменьшить...