Неопытный редактор CSS для разных размеров экрана?

У меня возникла проблема с HTML и CSS относительно размера экрана. Я знаю, как кодировать на обоих языках, но в итоге у меня такая же проблема с адаптацией экрана. Я закончил кодирование веб-сайта на Mac (27-дюймовый экран), и он выглядит потрясающе на других небольших размерах экрана.Неопытный редактор CSS для разных размеров экрана?

Что я делаю неправильно, чтобы оно не работало на других экранах, правильно и правильно адаптировалось к настройке CSS?

Я не знаю, нужен ли код для этого вопроса, если это так, я загружу его немедленно.

Большое спасибо.

источник

2014-01-03 Austin Whitewood

Время [медиазапросы] (https: //developer.mozilla. org/en-US/docs/Web/Guide/CSS/Media_queries) – Praveen

Как насчет использования медиа-запросов? Если время является ограничением, рассмотрите структуру Twitter Bootstrap/Foundation и т. Д., Чтобы сделать это для вас. –

Медиа-запросы, как было предложено выше, помогут вам решить проблему с несколькими размерами экрана, будь то MAC, Windows-машина, вкладка или смартфоны. [Ссылка] (http://www.htmlgoodies.com/html5/tutorials/an-introduction-to-css3-media-queries.html#fbid=IbqxQsusiEp) – AppleBud

Возможно, я ошибаюсь, но в кодекадемии (где я начал писать код) они говорят, что увеличение и уменьшение можно изменить, как это работает (но это может быть только из-за того, как они скомпилируются), чтобы сбросить масштаб ctrl + 0/Cmd + 0

источник

2014-01-03 05:28:43 user3155926

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

например: -

@media all and (max-width: 1000px) and (min-width: 700px) { 
    #sidebar ul li a:before { 
    content: "Email: "; 
    font-style: italic; 
    color: #666; 
    } 
}

подробнее на css media queries and using available space

источник

2014-01-03 05:35:41

Базовое решение - Bootstrap.Go и не хватайте его, чтобы не беспокоиться о какой-либо проблеме дизайна и проблемах с экраном, которые он сделает для вас.

Их много css, компонентов, встроенных javascript в bootstrap.

Просто скачайте bootsrap пакет и наслаждаться .............

источник

2014-01-03 05:39:40

Вам нужно будет узнать о жидкости дизайн или адаптивный дизайн на основе , что ваша цель.

Эта ссылка может помочь вам узнать больше о жидком дизайне: http://www.sitepoint.com/liquid-design/

и этим о адаптивном дизайне: http://en.wikipedia.org/wiki/Responsive_web_design

Эта другая ссылка является StackOverflow вопрос говорить о подобном случае, что вы можете взглянуть: How to deal with different screen resolutions in CSS?

источник

2014-01-03 05:42:37 sabdiel

Media Queries - это наилучшие варианты для получения гибкого веб-макета с использованием CSS.

Запросы СМИ: Запросы мультимедийных запросов CSS позволяют применять изменения в дизайне вашего сайта на основе размера и возможностей просмотра устройства, на котором отображается ваш контент. Это чрезвычайно мощный инструмент для создания гибких дизайнов, и он получил поддержку во всех основных мобильных браузерах (включая Safari, Chromium, Opera и даже предстоящий Internet Explorer Mobile [Windows Phone 7]).

Вот простой пример использования медиа-запрос в таблицу стилей вашего дизайна в:

#wrapper { 
    width: 80%; 
    margin: auto; 
    max-width: 1200px; 
    min-width: 800px; 
} 
@media screen and (max-width: 800px) { 
    #wrapper { 
    width: 90%; 
    min-width: 0; 
    } 
}

Click here to learn: How to use media-query

List of Media Queries for Standard Devices

источник

2014-01-03 05:50:58

Неопытный редактор CSS для разных размеров экрана?

ответ

Смежные вопросы