Ответ 1
IE 8 не поддерживает медиа-запросы из коробки.
На основе этого вопроса и этот вопрос, вы захотите использовать расширение, например css3-mediaqueries-js или Respond.
Я искал какое-то время и нашел, что некоторые люди его работали, но ни один из них не предоставляет образцы кода.
Я попробовал свои предложения, но это не сработало для меня. По предложениям я попытался добавить <meta http-equiv="X-UA-Compatible" content="IE=edge" />
, respond.js
или css3-mediaqueries-js
, но ни один из них не помог.
Здесь jsfiddle, если вы просмотрите его с помощью IE8, вы увидите, что как a
, так и b
находятся на независимо от ширины вашего браузера.
Но если вы просматриваете Chrome, FF или IE9 или выше, вы увидите их в разных строках или в одной строке в зависимости от ширины браузера.
UPDATE
Я попытался раскомментировать один из них (css3-mediaquery, html5shiv и ответить) за один раз, но ему не повезло ни с одним из них.
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="#" onclick="location.href='http://netdna.bootstrapcdn.com/twitter-bootstrap/latest/css/bootstrap-combined.min.css'; return false;" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row">
<div class="span4">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</div>
<div class="span8">
LOREM IPSUM DOLOR SIT AMET, CONSECTETUR ADIPISCING ELIT.
</div>
</div>
</div>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://netdna.bootstrapcdn.com/twitter-bootstrap/latest/js/bootstrap.min.js"></script>
<%--<script type="text/javascript" src="js/css3-mediaqueries.js"></script>--%>
<%--<script type="text/javascript" src="js/html5shiv.js"></script>--%>
<%--<script type="text/javascript" src="js/respond.js"></script>--%>
</script>
</body>
</html>
IE 8 не поддерживает медиа-запросы из коробки.
На основе этого вопроса и этот вопрос, вы захотите использовать расширение, например css3-mediaqueries-js или Respond.
Попробуйте использовать html5shiv, в основном это IE5 HTML5, включающий script, и это должно заставить bootstrap работать в IE 6,7 и 8. Это также может быть прямое горячее соединение:
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
Он должен быть включен перед <body> элемент (то есть в <head> )
В вашей проблеме используется answer.js с таблицами стилей CSS, которые находятся на внешних доменах. Respond.js исправит медиа-запросы для IE6-IE8.
https://github.com/scottjehl/Respond#cdnx-domain-setup
Respond.js работает, запрашивая оригинальную копию вашего CSS с помощью AJAX, поэтому, если вы размещаете свои таблицы стилей на CDN (или поддомене), вам нужно загрузить прокси-страницу, чтобы разрешить междоменную связь.
См. cross-domain/example.html для демонстрации:
Upload cross-domain/respond-proxy.html to your external domain
Upload cross-domain/respond.proxy.gif to your origin domain
Reference the file(s) via <link /> element(s):
<!-- Respond.js proxy on external server -->
<link href="http://externalcdn.com/respond-proxy.html" id="respond-proxy" rel="respond-proxy" />
<!-- Respond.js redirect location on local server -->
<link href="/path/to/respond.proxy.gif" id="respond-redirect" rel="respond-redirect" />
<!-- Respond.js proxy script on local server -->
<script src="/path/to/respond.proxy.js"></script>
Если у вас возникли проблемы с настройкой междоменного домена, убедитесь, что у response-proxy.html нет строки запроса, добавленной к ней.
В соответствии с: https://drupal.org/node/2173441
Чтобы ваш сайт Bootstrap работал в IE8, вам необходимо выполнить следующие действия:
/admin/config/development/performance
Да в Internet Explorer 8 или более низкая ширина класса "контейнер" как 940px. Но в Internet Explorer9 +, Firefox, Google Chrome и т.д. Ширина класса contianer называется 1170px.
То же самое касается и Zurb Foundation.
Если предположить, что наш клиент попросил не рассматривать веб-сайт для просмотра в IE8 <, тогда мы начинаем реализацию функции начальной загрузки или функции RWD для zurb.
Здесь решение, над которым я работал, работает с базой Bones. Его можно очень легко использовать с бутстрапом.
Проблема с загрузками CROSS DOMAIN css в IE 8 была решена, как было предложено @Akshay Raje и @Craig London.
Чтобы добавить к нему, answer.js или reply.min.js необходимо добавить до response.proxy.js для работы установки.
Попробуйте следовать за этим тегом "link" и просто перед тем, как закрыть заголовок(), это означает, что в конце внутри "head" tag. Этот формат работает на всех веб-сайтах на 99%. Но в какой-то теме drupal bootstrap не работает.
Запомните сохранение всех в локальной папке веб-сайта, Не используйте CDN.
<!--[if lt IE 9]>
<script type='text/javascript' src="/sites/all/themes/bootstrap_subtheme/js/css3-mediaqueries.js"></script>
<script type='text/javascript' src="/sites/all/themes/bootstrap_subtheme/js/html5.js"></script>
<script type='text/javascript' src="/sites/all/themes/bootstrap_subtheme/js/respond.min.js"></script>
<![endif]-->
Довольно часто пользователи загружают CSS с помощью медиа-запросов (загрузочный и другие файлы) из сетей доставки контента ( CDN, например oss.maxcdn.com или cdnjs.cloudflare.com). Respond. не работает с загружаемым извне CSS, поэтому вам нужно загрузить свой Bootstrap CSS (или другой CSS с медиа-запросами) с вашего сервера.
Да, он не поддерживает IE. Я не анти-бутстрап, но я просматриваю коды css для начальной загрузки. и выяснили, что другие ширины не определяются как%, я читаю в другой статье в блоге, что вы должны использовать% для ширины, чтобы она была отзывчивой, которая истинна.
и когда дело доходит до ipad, код css, который используется для этого при загрузке, не поступает из медиа-запроса, его просто обычные коды css, которые не объявляются внутри медиа-запросов. и это фиксированная ширина, которую вы должны использовать для ie7 и 8. (поэтому сначала подумайте об этом, если вы хотите использовать bootsrap.)
в будущем (или, возможно, сейчас), когда есть новый гаджет, который не поддерживается бутстрапом. ваш клиент может вернуться, чтобы исправить эту проблему.
Мы все знаем, что ie7 и 8 все еще существуют, поэтому он должен был работать и с этими двумя старыми браузерами.
поэтому, если бы я был вами, создайте свою собственную инфраструктуру для удовлетворения всех требований вашего сайта/проекта.
но я не анти-бутстрап, просто мысли... потому что я тоже разрабатываю сайты.