Я не могу связать мой CSS файл с моим HTML файлом. Но он работает нормально с Live Server. Что не так? - PullRequest
0 голосов
/ 31 марта 2020

У меня был файл CSS и HTML в одной папке на рабочем столе. Раньше <link rel="stylesheet" type="text/css" href="style.css" /> работал нормально. Теперь я сделал две папки HTML и CSS для разделения файлов. Итак, теперь я использую <link rel="stylesheet" type="text/css" href="/CSS/style.css" />. Он отлично работает на Live Server в VS Code, но когда я обычно открываю index. html в браузере, файл CSS не связывается, как и изображения, находящиеся в папке img. Я пробовал href = "./CSS/style.css", href="/style.css". Работает ТОЛЬКО В ЖИВОМ СЕРВЕРЕ !!! HELP!

1 Ответ

0 голосов
/ 31 марта 2020

Допустим, у вас есть один основной каталог с тремя подкаталогами

-MainDirectory
    -HTML
    -CSS
    -Images

Теперь каждый файл находится в своем каталоге ...

-MainDirectory
    -HTML
        -index.html
    -CSS
        -style.css
    -Images
        image1.jpg
        image2.jpg

Путь для доступа к сайту это MainDirectory / HTML / index. html

Теперь основной файл (index. html) должен использовать таблицу стилей, размещенную в MainDirectory / CSS, и путь к этому - манипулирование путь к go на один каталог в обратном направлении и оттуда перейдите к css, чтобы код выглядел следующим образом

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

Теперь код выполняет переход с HTML на MainDirectory и оттуда он идет в CSS, где он читает данные, написанные в стиле. css.

То же самое происходит с изображениями, если вы хотите получить доступ к изображению, вам придется извлечь данные из ../Images/image1.jpg"

Другой способ навигации по каталогам - использовать sla sh / в качестве отправной точки, поэтому, например, если вы используете MainDirectory в качестве отправной точки, вы также можете получить доступ к таблице стилей li. ke this /CSS/style.css ... Это говорит о том, что код должен начинаться с самой первой папки, которая существует по этому пути (в нашем случае это MainDirectory), и оттуда перейти туда, куда вам нужно go ...

Поймите это, создав гиперссылки ...

<a href="/style.css">Hover Me!</a>

Поместите этот код в index.html, затем откройте index.html в браузере и наведите указатель мыши на ссылку.

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

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