Внешний CSS отлично работает в Safari, но не в Firefox, Google Chrome или Opera. - PullRequest
0 голосов
/ 03 мая 2018

Итак, у меня есть простой HTML-файл с 3 внешними связанными CSS-файлами.

<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <title>some website</title>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" type="style/css" href="style/reset.css" charset="utf-8"/>
    <link rel="stylesheet" type="style/css" href="style/shared.css" />
    <link rel="stylesheet" type="style/css" href="style/home.css" />
    <!--[if lt IE 9]>
        <script src="scripts/html5shiv.js" type="text/javascript"></script>
    <[end if]-->
</head>
<body>
</body>
</html>

CSS-файлы прекрасно работают в Safari, но и Firefox, и Google Chrome не распознают все три CSS-файла. та же проблема в Опере.

Я дважды проверил пути к файлам, добавил charset = "utf-8", где это было необходимо, и попытался очистить кеш, удалил все связанные файлы в библиотеке моей учетной записи и переустановил оба браузера. Все та же проблема.

Я тестирую сайт локально на Mac с macOS 10.13.4 (17E202)

Safari, версия 11.1 (13605.1.33.1.4)

Google Chrome версия 66.0.3359.139 (официальная сборка) (64-разрядная версия)

Firefox версия 59.0.3 (64-разрядная версия)

Версия Opera 52.0.2871.99

Некоторые скриншоты состояния инспектора.

В редакторе стилей Firefox нет таблицы стилей

Google Chrome также не отображает CSS-файлы

Как видите, изображения и файлы javascript в порядке.

Что я делаю не так? Есть предложения?

каким-то образом изменить три строки, связанные с CSS-файлами, решил проблему.

<link rel="stylesheet" href="style/reset.css">
<link rel="stylesheet" href="style/shared.css">
<link rel="stylesheet" href="style/home.css">

1 Ответ

0 голосов
/ 03 мая 2018

Атрибут type должен быть указан как type="text/css", вы написали type="style/css" измените его и попробуйте и убедитесь, что ваш путь правильный. проверьте браузер на наличие ошибок 404.

   <link rel="stylesheet" type="text/css" href="style/shared.css" />

Ссылка для справки

...