Путь к файлу CSS правильный, код CSS правильный, но он не работает - PullRequest
Новая
       42

Путь к файлу CSS правильный, код CSS правильный, но он не работает

4 голосов
/ 27 ноября 2009

У меня странная, раздражающая проблема. У меня есть папка css/ и index.html в корне. Я загружаю CSS-файлы в шапку следующим образом: 

<!DOCTYPE html 
     PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <title>blabla</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="keywords" content="keywords" />
    <meta name="description" content="desc" />

    <!-- style files -->
    <link rel="stylesheet" type="text/css" href="css/reset.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="css/layout.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="css/global.css" media="screen" />
</head>

но css не работает: я вижу простой index.html. Я уверен, что путь CSS правильный; когда я нажимаю «просмотреть исходный код» и копирую / вставляю путь к файлам CSS, он показывает файлы CSS.

Кроме того, когда я копирую CSS прямо в index.html, это работает. В чем может быть проблема?

Ответы [ 17 ]

2 голосов
/ 27 ноября 2009

Относительный URL, вероятно, неверный. Чтобы помочь вам в дальнейшем, нам нужно знать две вещи:

  1. Какой полный (абсолютный) URL-адрес, с которого вы открываете HTML-страницу? Проверьте адресную строку браузера.
  2. Каков полный (абсолютный) URL, с помощью которого вы можете открыть файл CSS по отдельности в своем браузере?

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

2 голосов
/ 27 ноября 2009

Вероятно, не используется в качестве текста / CSS. Вы проверили конфигурацию своего сервера?

1 голос
/ 27 ноября 2009

Это либо неправильный заголовок типа контента, как предлагает jensgram, либо неверный относительный путь (css / ...), потому что сама страница находится в другой папке.

Установите Firebug и перейдите на вкладку «net». Он покажет вам, если файлы не удалось загрузить из-за неправильного URL.

1 голос
/ 01 февраля 2015

Обычно для такого рода проблем я бы сделал:

  • добавить стиль типа body {border:10px solid red !important;} в файл css и обновить файл html.
  • Проверьте, нет ли каких-либо опечаток в пути и именах файлов, дважды проверьте еще раз, при необходимости используйте копирование / вставку имен.
  • Используйте версии, например ... href="css/reset.css?001" ...
  • Проверьте права доступа к папкам и файлам на сервере.
  • Попробуйте загрузить его в другом браузере или в «приватном режиме».

Надеюсь, это поможет!

1 голос
/ 27 ноября 2009

Попробуйте Firefox и Firebug. Посмотрите в консоли ошибок; может быть, это просто небольшая опечатка.

1 голос
/ 02 февраля 2015

Попробуйте использовать Firebug / Chrome Web Inspector и посмотрите, загружаются ли файлы. Возможно, веб-пользователь не имеет прав доступа к файлам CSS, в этом случае вы должны увидеть, что файлы не могут быть загружены, и они возвращают статус 401 HTTP. В этом случае попытайтесь установить правильные разрешения (через CHMOD, если это сервер Unix, 0644 должно быть достаточно).

1 голос
/ 04 февраля 2015

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

<link rel="stylesheet" type="text/css" href="../css/reset.css" media="screen/>

или 

  <link rel="stylesheet" type="text/css" href="~/css/reset.css" media="screen" />
1 голос
/ 28 января 2015

Попробуйте использовать формат:
<link rel="stylesheet" href="/css/file_name_here.css" type="text/css" media="screen">
и т. Д. Хотя это не должно, это может быть порядок параметров, которые его вызывают. Это порядок, которым я пользуюсь, и он всегда работал для меня. Я также заметил, что у вас есть три <!DOCTYPE> декларации, это necassery и может ли это быть причиной? Я исследовал и
обнаружил, что разрешен только один ...

Независимо от того, являются ли они причинами или нет, я надеюсь, что вы найдете решение в ближайшее время!

0 голосов
/ 04 февраля 2015

Это решение поможет, только если вы пытаетесь развернуть в Интернете, а не в местной среде, но так как здесь не хватает деталей, я хотел уточнить.

Я помню, что у меня была та же проблема, и я исправил ее, добавив // перед путем к файлу, поскольку браузер должен знать, что он загружен из Интернета.

Вы можете легко это проверить, вставив url с // и без *1000* перед css.

Например 

xxx.xxx.xxx.xxx/path/to/css.css

Не будет загружен, пока 

//xxx.xxx.xxx.xxx/path/to/css.css

будет загружен.

Другие возможности будут

  • Неправильные разрешения
  • Неправильный путь, может быть, вы что-то упустили? Попробуйте косую черту в начале или на абсолютном пути.
0 голосов
/ 04 февраля 2015

Некоторые предложения ...

Согласно W3 : 

Partial URLs are interpreted relative to the source of the style sheet, not relative to the document.

Поэтому я предлагаю использовать /css/reset.css в качестве пути.
<link rel="stylesheet" type="text/css" href="/css/reset.css" media="screen" />

Однако, если это не сработает, я постараюсь добавить адрес вашего сайта целиком.

Показывает ли http://www.yourweb.com/css/reset.css что-нибудь?

Если вы могли бы использовать PHP, я предлагаю добавить этот код в ваш индексный файл следующим образом: 

<?php echo realpath(dirname(__FILE__)); ?>

Вы увидите свой абсолютный путь.

Также вы смогли продублировать вашу проблему на внешних тестовых сайтах, таких как jsfiddle, используя URL-путь к вашей CSS?

Страница:
...