Возникли проблемы с отправкой определенных таблиц стилей в IE - PullRequest
4 голосов
/ 06 февраля 2012

Независимо от того, что я делаю, IE не будет отображать мой сайт. Я не уверен, что я делаю неправильно и как я могу исправить это. Если кто-то может помочь, пожалуйста. Я был озадачен этим несколько дней

Я создаю свой первый веб-сайт на HTML5 и, конечно же, на новой территории есть чему поучиться. Мой веб-сайт хорошо работает во всех известных мне браузерах и устройствах, и я использую медиазапросы CSS3 для отправки необходимой информации, когда экран имеет определенный размер.

Теперь, конечно, IE не поддерживает эту функцию, поэтому я использую условные комментарии, чтобы увидеть, является ли это IE, и использует ли он мои стили ie.css. Однако я должен положить это неправильно, потому что он либо не работает (ничего не отображается на странице, а затем падает), либо показывает мобильные стили в полноразмерном окне! Я попытался использовать файл response.js И файл css3-mediaqueries.js, и они не работают для меня. Это последнее, что мешает мне запустить этот сайт, и после борьбы с тем, почему он не работает, я отчаянно пытаюсь найти решение.

Это нижняя часть моей головы.

<link rel="stylesheet" href="css/style-fluid.css" />
<!--[if IE]>
<link rel="stylesheet" href="css/ie.css" />

<![endif]-->
<!--[if IE 6]>
<link rel="stylesheet" href="css/ie.css" />
<![endif]-->

<!--[if IE 7]>
<link rel="stylesheet" href="css/ie.css" />
<![endif]-->

<script src="js/libs/modernizr-2.0.6.min.js"></script>
</head>

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

Любая помощь приветствуется.

Ответы [ 9 ]

2 голосов
/ 12 февраля 2012

сначала я думаю, что это самая верхняя часть вашей головы ... когда вы отклоняетесь, у вас появляется эта странная комментирующая разметка, которая, как мне кажется, вызывает проблемы, и не отображает ваш последующий IF IE должным образом.измените
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]--> на
<!--[if gt IE 8]> <html class="no-js" lang="en"> <![endif]-->

, но я тестировал его на другом сервере, и это не беспокоит.Вы считаете сервер, на котором он запущен, проблемой?кажется, что вы пробовали довольно много вещей ..

попробуйте мое первое предложение и посмотрите http://tinyurl.com/87maskt в ie, а не ie .. [Я просто c & p из источника и ссылки здесь.если вы хотите, вы можете прислать мне действительный код главной страницы для тестирования там.]

удачи!

1 голос
/ 14 февраля 2012

Я думаю, что проблема в том, что у вас нет места в вашем css-типе. Вы должны были установить тип как text/css

<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" href="ie.css" />
<![endif]-->
0 голосов
/ 15 февраля 2012

Просто мысль ... Почему бы вам не использовать Javascript, чтобы узнать, используют ли они Internet Explorer, и, если они есть, перенаправить их на другую домашнюю страницу, которая импортирует ie.css:

index.php

<link rel="stylesheet" href="css/style-fluid.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
    if (navigator.appName == 'Microsoft Internet Explorer')
    {
        parent.location = "ie.php";
    }
}

</script>  

ie.php

<link rel="stylesheet" href="css/ie.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
    if !(navigator.appName == 'Microsoft Internet Explorer')
    {
        parent.location = "index.php";
    }
}
</script> 

Проблема решена!Надеюсь, это поможет!

0 голосов
/ 15 февраля 2012

Попробуйте переместить атрибут class= в теге <html> в тег <body> и измените css для выбора вместо <body>

<!--[if lt IE 9]> <body class="ie" lang="en"> <![endif]-->
<!--[if gt IE 8]> <body class="no-js" lang="en"> <!--<![endif]-->
0 голосов
/ 14 февраля 2012
<!--[if lt IE **7**]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]>**<!-->** <html class="no-js" lang="en"> <!--<![endif]-->

Удалите комментарий из вашего последнего оператора if и измените первые 7, если оператор тоже 6, а также удалите двойные операторы if для 8

0 голосов
/ 11 февраля 2012

Есть несколько вещей, которые вы могли бы сделать:

  1. Обновите ваш HTML-тег, чтобы использовать условные комментарии, как это сделано в шаблоне HTML5.В ответе Скотта приведен фрагмент: https://stackoverflow.com/a/9153257/230649
  2. Добавьте файл response.js в ваш проект, чтобы получить поддержку медиазапросов в IE: https://github.com/scottjehl/Respond

Если работает response.js, вы выиграливам не нужно беспокоиться о вашей таблице стилей IE, и вы можете избежать всего этого вместе.

Теперь вот что важно: ваша таблица стилей IE имеет встроенный сброс HTML5.Вы должны избавиться от этого.Единственное, что вы должны включить в свою таблицу стилей, специфичную для IE, - это незначительные изменения, которые вы хотите внести в размеры текста и т. Д.

НО, надеюсь, вам вообще не понадобится использовать эту специфическую таблицу стилей IE, если response.jsподдерживает ваши медиа-запросы.Я бы попытался удалить таблицу стилей, специфичную для IE, и реализовать response.js для решения ваших проблем.

0 голосов
/ 08 февраля 2012

Думаю, я понял.Удалите раздел печати @media из вашего ie.css.

0 голосов
/ 08 февраля 2012

Попробуйте это:

<!--[if lt IE 8]>
<link rel="stylesheet" href="css/ie.css">
<![endif]-->
0 голосов
/ 06 февраля 2012

Я думаю, что проблема не в таблицах стилей ... это ваш HTML-тег ...

<!--[if lt IE 7]> <html class="ie" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="ie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="ie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

Могу я спросить, почему ???? Это действительно не нужно.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...