IE не поддерживает относительные пути в базовом элементе при обращении к файлам CSS - PullRequest
Новая
       6

IE не поддерживает относительные пути в базовом элементе при обращении к файлам CSS

5 голосов
/ 01 июля 2011

У меня есть сайт, который использует базовый тег , чтобы установить абсолютный путь для относительных URL. Он отлично работает во всех браузерах, в которых я его тестировал, кроме IE (большой сюрприз). Основываясь на запросе, который IE делает для CSS-файла, он, похоже, не замечает базовый тег. Это подтверждает базовый тег со всем остальным на странице. Почему это происходит? Можно ли с этим что-то сделать, кроме использования абсолютного пути для ссылки на файл CSS? Вот мой код: 

<!DOCTYPE html>
<html><head>
<title>base test</title>
<base href="/baseTest/">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div>foo</div>
</body></html>

Это то, что находится в файле baseTest / style.css: 

div {
    background: yellow;
}

РЕДАКТИРОВАТЬ: То же самое происходит и для изображений. Все тесты, которые я делал, были в IE9. Проблема возникла в стандартном режиме, а также в режимах совместимости IE8 и IE7.

РЕДАКТИРОВАТЬ 2: Работает нормально, если я указываю абсолютный URL. Я не знал, что поддержка относительных URL-адресов была недавней функцией. Я могу отказаться от своего плана, используя базовый тег, чтобы избежать повторения путей, если я не смогу найти какой-либо способ (например, взломать JS), чтобы сделать эту работу.

Пример страницы: http://www.debugtheweb.com/test/base/relative.html

Ответы [ 2 ]

7 голосов
/ 01 июля 2011

Я точно не знаю, является ли это вашей проблемой в IE или нет, но согласно соответствующей части документа стандартов HTML 4.01 , URL в базовом href должен быть абсолютным URI.Далее, в примере, учитывая, что это выглядит так (с именем файла): 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
 <HEAD>
   <TITLE>Our Products</TITLE>
   <BASE href="http://www.aviary.com/products/intro.html">
 </HEAD>

 <BODY>
   <P>Have you seen our <A href="../cages/birds.gif">Bird Cages</A>?
 </BODY>
</HTML>

В поисках Google я нашел обсуждение того, в какой версии Firefox добавлена ​​поддержка относительных путей в базовом href (которыйэто то, что вы используете), так что это явно не то, что всегда было и не то, что описывается в стандарте 4.01.

Спецификация HTML5 , кажется, описывает и позволяет базовым URL-адресамне имеет хост-части (относительно хоста), так что, возможно, это то, что недавно было добавлено в спецификации, которые IE еще не поддерживал или еще не полностью поддерживал для загрузки файла CSS.

Я бы посоветовал вам попробоватьположить свой домен в базу HREF.

3 голосов
/ 19 декабря 2014

Согласно спецификациям html: http://www.w3.org/TR/html401/struct/links.html см .: Информация о пути: раздел элемента BASE - Этот атрибут задает абсолютный URI, который действует как базовый URI для разрешения относительных URI. Chrome и Firefox поддерживают относительные пути в этом теге, а IE - нет.IE строго следует спецификациям.

Чтобы манипулировать и включать absolute url в базовый тег, просто включите тег сценария после тега <head>, как указано ниже 

<script type="text/javascript">
document.write("<base href='" + window.location.href.substring(0, location.href
        .indexOf("/context") + 9) + "' />");
</script>
...