Ведущие "/" разрывы ссылок на файлы в заголовке

Я пытаюсь обновить сайт, построенный с помощью Jekyll, но у меня возникла проблема со ссылками в HTML, которые не работают. Вот начало заголовка файла header.html:Ведущие "/" разрывы ссылок на файлы в заголовке

<div id="primary-header" class="{{include.class_name}}"> 
<div class="container"> 
<div class="row"> 
    <div class="logo-wrap"> 
    <a href="/"> 
     <img src="/img/logos/header-logo.png" alt="Logo"> 
    </a> 
    </div>

Проект находится в каталоге/Volumes/Holder/Работа/Проекты/c4 Заголовок-logo.png находится в каталоге/Volumes/Holder/Работа /Projects/c4/img/logos/header-logo.png файл Я загрузки в моем браузере /Volumes/Holder/Work/Projects/c4/index.html

по какой-то причине, когда я показываю этот файл на моем компьютере (OSX 10.9.4) он не будет распознавать файлы, обозначенные символом «/ img». Если я удалю «/», он найдет файл без проблем, но это не является эффективным решением, так как существует сто или около того ведущего «/» через несколько файлов.

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

источник

2014-09-15 user1488639

изменить ваш домен, чтобы указать каталог, где папка IMG находится в: D – Sunand

попробуйте использовать экранирующий символ/перед каждым из них - это должно выглядеть // IMG // логотипы и т.д. Так что их double // должен работать. Кроме того, вам может быть лучше сделать , добавив «~» перед вашим img – jbutler483

Косая черта в начале пути указывает, что это из корневой папки, это намерение? – Luke

У вас есть несколько различных вариантов, в том числе с использованием ~ перед вашим IMG пути, так что это будет выглядеть следующим образом:

<img src="~/img/logos/header-logo.png" alt="Logo">

~ означает, что часть пути к файлу не включен, и может быть внутри папки, которая не упоминается в этом пути, например:

your image location = MyComputer/MyStuff/img/logos/header-logo.png

, которые можно ссылаться с помощью:

~/img/logos/header-logo.png

который найдет его для вас.

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

EDIT

Для осветления, когда использовать тильды Слэш (более точно Slash), пожалуйста, обратитесь к: https://stackoverflow.com/a/6424147/3436942

источник

2014-09-15 12:48:49 jbutler483

Тильда должна быть безоговорочным персонажем, это означает без особой цели (см. Rfc 3986) (http://tools.ietf.org/html/rfc3986#section-2.3)). Это работает на некоторых серверах Microsoft или Apache с mod_userdir. Но это не стандартный способ разрешения пути на веб-сервере. Определенно плохой совет. –

Глядя на ссылку, которую я опубликовал в своем редактировании, для большинства людей это довольно стандартная практика tbh. Я не профессионал, но да, конечно, будут разные решения (о которых я уверен, можно было бы подробно обсудить), но из того, что я понимаю/знаю, это решение, которое я имею учили. – jbutler483

Ссылка, опубликованная в вашем правлении, относится к технологиям ASP и IIS, которые далеки от стандартов. И эта тильда не будет влиять на парсинг URL на обычных серверах Apache или Nginx. –

положил папку img в корневом каталоге

источник

2014-09-15 12:49:17

Проект находится в/Объемы/Владелец/Работа/Проекты/c4 Заголовок-logo.png находится в/Товаров/Владелец/Работы/Проекты/c4/img/logos/ Файл, который я загружаю в своем браузере, Объемы/Владелец/Работа/Проекты/c4/index.html Разве это не означает, что папка img находится в корне? – user1488639

ОК, похоже, что ваша папка img находится в правильном месте, и вы загружаете index.html с использованием файлового протокола. Вам необходимо загрузить index.html с помощью сервера (apache, nginx ..) с/Volumes/Holder/Work/Projects/c4/в качестве корневого пути. –

Я думаю, лучше удалить '/', чтобы сделать путь относительным. Что будет работать независимо от пути веб-сайта. –

Вот что BaseUrl изготовлен для.

В вашем _config.yml:

baseurl: '/Volumes/Holder/Work/Projects/c4'

Теперь, когда вы вызываете актив (CSS, Jss или изображение) просто снабдите ваш базовый URL для него.

<link rel="stylesheet" href="{{ site.baseurl }}/css/main.css" > 

<script src="{{ site.baseurl }}/assets/javascripts/scripts.js"></script> 

<img src="{{ site.baseurl }}/img/logos/header-logo.png">

источник

2014-09-15 15:10:50

Хотя это может быть правдой, я обычно использую относительные пути, поэтому я могу тестировать файлы непосредственно с жесткого диска без сервера, и они могут быть переданы на FTP без изменений на сервер (а не GitHub, в моем случае). –

Но если относительный путь **/img/image.jpg ** из index.html работает хорошо, он разбивается на ** folder/page.html **, поэтому ** baseurl ** полезен. Это позволяет стандартизировать доступ к вашим активам, даже если ваш сайт не размещен в корне домена. –

У меня нет относительных путей, начинающихся с '/'. Mine относятся к каталогу, в котором находится html-файл. Поэтому у меня также есть пути, такие как '../ images/photo.jpg' и т. Д. Это работает. –

Ведущие "/" разрывы ссылок на файлы в заголовке

ответ

Смежные вопросы