Вопросы с тегом «responsive-design»

Мне трудно разобраться с масштабированием шрифтов. В настоящее время у меня есть этот сайт с телом font-size100%. 100% чего хотя? Это, кажется, вычислить в 16 пикселей. У меня сложилось впечатление, что 100% будет как-то относиться к размеру окна браузера, но, видимо, не потому, что это всегда 16 пикселей, независимо от …

1189 css  responsive-design  font-size 

Я хочу создать, divкоторый может изменить свою ширину / высоту при изменении ширины окна. Существуют ли какие-либо правила CSS3, которые позволили бы изменить высоту в соответствии с шириной при сохранении соотношения сторон ? Я знаю, что могу сделать это с помощью JavaScript, но я бы предпочел использовать только CSS.

1059 html  css  responsive-design  aspect-ratio 

В чем разница между col-lg-*, col-md-*и col-sm-*в Twitter Bootstrap?

544 css  twitter-bootstrap  twitter-bootstrap-3  responsive-design  bootstrap-4 

Я запутался по поводу различных опций в сетке начальной загрузки Twitter , и как они идут вместе. Для начала, вы можете иметь обычную фиксированную containerили a container-fluid. Тогда либо можно включить либо обычный row, либо текучий ряд row-fluid. То есть у вас может быть фиксированный контейнер с рядом жидкости или …

399 twitter-bootstrap  responsive-design  fluid-layout  fixed-width 

Я создал сайт, используя сетку 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> <!-- End Tagline --> </div> <!-- End Row --> …

343 css  responsive-design  font-size  zurb-foundation  em 

В каждом учебном руководстве по разработке адаптивных веб-сайтов рекомендуется использовать display:noneсвойство CSS, чтобы скрыть содержимое от загрузки в мобильных браузерах, чтобы веб-сайт загружался быстрее. Это правда? Не display:noneзагружает изображения или все еще загружает контент в мобильном браузере? Есть ли способ предотвратить загрузку ненужного контента в мобильных браузерах?

336 css  responsive-design 

Глядя через начальную загрузку, кажется, что они поддерживают свертывание элементов меню для небольших экранов. Есть ли что-то похожее для других предметов на странице? Например, у меня наряду с таблетками навплывало право. На маленьком экране это вызывает проблемы. Я хотел бы, по крайней мере, поместить его в похожее раскрывающееся меню. Возможно …

298 html  css  twitter-bootstrap  responsive-design 

Я хочу, чтобы кнопка занимала всю ширину столбца, но возникают трудности ... <div class="span9 btn-block"> <button class="btn btn-large btn-block btn-primary" type="button">Block level button</button> </div> Как сделать кнопку шириной столбца?

276 css  twitter-bootstrap  html  responsive-design 

Предположим, у меня есть скрипт гистограммы, который строит графику SVG 960 500. Как сделать так, чтобы изменение размера графической ширины и высоты было динамичным? <script> var n = 10000, // number of trials m = 10, // number of random variables data = []; // Generate an Irwin-Hall distribution. for …

224 javascript  responsive-design  d3.js 

В настоящее время, когда ширина браузера падает ниже 768 пикселей, панель навигации переходит в свернутый режим. Я хочу изменить эту ширину на 1000 пикселей, поэтому, когда размер браузера ниже 1000 пикселей, панель навигации переходит в свернутый режим. Я хочу сделать это без использования LESS, я использую стилус, а не LESS. …

205 css  twitter-bootstrap  responsive-design  navbar  collapse 

У меня есть веб-сайт (g-floors.eu), и я хочу, чтобы фон (в css я определил bg-изображение для контента) также был адаптивным. К сожалению, я действительно не имею ни малейшего представления о том, как это сделать, кроме одной вещи, о которой я могу думать, но это довольно обходной путь. Создание нескольких изображений …

197 css  responsive-design  background-image  image-resizing 

(Это вопрос, состоящий из нескольких частей, я сделаю все возможное, чтобы суммировать сценарий.) В настоящее время мы создаем адаптивное веб-приложение (программа чтения новостей), которое позволяет пользователям перемещаться между содержимым с вкладками, а также осуществлять вертикальную прокрутку внутри каждого содержимого с вкладками. Распространенным подходом к проблеме является наличие оболочки, divкоторая заполняет …

191 javascript  ios  css  responsive-design  mobile-safari 

IE8 не поддерживает следующий медиа-запрос CSS: @import url("desktop.css") screen and (min-width: 768px); Если нет, какой альтернативный способ написания? То же самое отлично работает в Firefox. Есть проблемы с кодом ниже? @import url("desktop.css") screen; @import url("ipad.css") only screen and (device-width:768px);

178 html  css  responsive-design  internet-explorer-8  media-queries 

На этот вопрос есть ответы на Переполнение стека на русском : Сетка из адаптивных (отзывчивых) квадратов Мне интересно, как бы я мог создать макет с адаптивными квадратами . Каждый квадрат будет иметь вертикально и горизонтально выровненный контент. Конкретный пример показан ниже ...

170 html  css  responsive-design  grid-layout  aspect-ratio 

Я читал этот пост, посвященный стеку, под названием «Можете ли вы сделать iFrame отзывчивым?», И один из комментариев / ответов привел меня к этому jfiddle. Но когда я попытался реализовать HTML и CSS, чтобы удовлетворить свои потребности, у меня не было таких же результатов / успеха. Я создал свою собственную …

144 css  iframe  responsive-design