#html #css #github #github-pages
#HTML #css #github #github-страницы
Вопрос:
У меня есть страница с ошибкой 404 для моего сайта Github pages, которая использует внешний CSS и изображения, подобные этому:
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>404 Error - Page not found</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@800amp;display=swap" rel="stylesheet">
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<link href="https://fonts.googleapis.com/icon?family=Material Icons" rel="stylesheet">
<link rel='stylesheet' href='./site.css'>
<link rel="icon" href="./images/icons/icon.ico">
</head>
Он отлично работает с моим сайтом GitHub pages, когда URL-адрес содержит только одно имя пути. Например:
Однако, когда имя пути превышает одно имя пути, CSS не применяется:
Моя структура каталогов выглядит так:
root.
│ 404.html
│ index.html
│ site.css
│
├───images
│ │ file1.png
│ │ file2.png
│ │ file3.jpg
│ │ file4.png
│ │ file5.jpg
│ │
│ └───icons
│ file6.png
│ file7.ico
│ file8.png
│ file9.png
│ file10.png
│
This is all that's important
Был бы очень признателен за любую помощь!
Ответ №1:
Используйте абсолютный путь вместо относительного.
Вы используете относительный путь ( ./site.css
) вместо абсолютного пути ( /site.css
). При использовании ./site.css
он говорит, что в этом каталоге используйте CSS сайта относительно URL. Когда вы добавляете второй каталог, который вы запрашиваете /blah/site.css
. Просто удалите точку ( /site.css
), чтобы всегда ссылаться на файл CSS корневого каталога.