Пятница, 11.07.2025, 01:29

Интернет Мир

Форма входа
Поиск
Категории раздела
Мои статьи [8]
HTML5 [9]
JAVASCRIPT [0]
CSS3 [1]
Наш опрос
Что полезное Вы находите в Интернете? (Можно выбрать несколько вариантов ответов)

Всего ответов: 1
Статистика
Язык сайта
Меню сайта
Друзья сайта
  • Официальный блог
  • Сообщество uCoz
  • FAQ по системе
  • Инструкции для uCoz
  • Главная » Статьи » CSS3

    Использование медиазапросов для изменения дизайна

    CSS -стили, располагающиеся ниже в каскадной таблице стилей, имеют больший
    приоритет по сравнению с эквивалентными стилями, находяшимися выше (если
    только более высоко расположенные стили не окажутся более подходящими). Сле-довательно, в начале таблицы стилей мы можем задать базовые стили, применимые
    ко всем версиям нашего дизайна, а затем переопределить соответствующие разде-лы с помощью медиазапросов далее в документе. Например, можно задать навига-ционные ссылки как простые текстовые ссылки для версии дизайна, предназна -ченной для больших областей просмотра (где более высока вероятность того, что
    пользователи задействуют мышь), а затем медиазапросами заменить соответству-ющие стили, чтобы обеспечить более крупную целевую область (для нажатий паль-цами) для более ограниченных по размеру областей просмотра.
    Наилучший способ загрузки медиазапросов
    для  адаптивных веб-дизайнов
    Несмотря на то что современные браузеры достаточно умны для того, чтобы иг-норировать не предназначенные для них целевые файлы медиазапросов, иногда
    это не мешает им загружать подобные файлы. Таким образом, размещение разных
    стилей, связанных с медиазапросами, в отдельных файлах имеет лишь небольшие
    преимущества (не считая личных предпочтений и/или разделения кода на блоки).
    Использование отдельных файлов влечет рост количества HTTP-запросов, необ- HTTP -запросов, необ- -запросов, необ-ходимых для обработки страницы, что, в свою очередь, приводит к ее более мед-ленной загрузке.
    JavaScript -инструмент Respond.js ( https://github.com/scottjehl/Respond), позволя -ющий наиболее быстро добавить частичную поддержку медиазапросов в Internet
    Explorer версии 8 и ниже, на текущий момент не способен проанализировать CSS -код, на который ссылается команда @import . Поэтому я рекомендую добавлять
    2.3. Наш первый адаптивный веб-дизайн 59
    стили, связанные с медиазапросами, в уже имеющуюся таблицу стилей. Например,
    вы можете просто добавить медиазапрос в существующую таблицу стилей, исполь-зуя следующий синтаксис:
    @media screen and (max-width: 768px) { ваши стили }

    Категория: CSS3 | Добавил: evglenkor (05.05.2014)
    Просмотров: 384 | Рейтинг: 0.0/0
    Всего комментариев: 0
    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]