Изображение не отображается в README.md на GitHub

Я пытаюсь добавить изображение в README.md в моем репозитории, используя уценку ниже:

![ScreenShot](https://github.com/i-saumitra/Voice-controlled-MP3-Player/blob/master/screenshot.jpg)

Но изображение не отображается, когда я посещаю мой репозиторий. Вместо этого появляется ссылка на изображение. Щелчок по ссылке откроет изображение в новом окне.

Я также пробовал использовать относительный путь:

![ScreenShot](screenshot.jpg)

Но это означает, что страница не найдена.

Какова правильная уценка для отображения изображения в README.md

Оба README.md и файл изображения находятся в одном каталоге/каталоге.

Каков правильный способ отображения изображения в github README.md?

Полное содержимое файла README.md выглядит следующим образом:

Voice-controlled-MP3-Player
===========================

A MP3 player which accept voice command like PLAY, PAUSE, FORWARD, etc. Using C# and Microsoft Speech API.

![ScreenShot](https://github.com/i-saumitra/Voice-controlled-MP3-Player/blob/master/screenshot.jpg)

Ответ 1

Обновленный контент

С 30 января 2013 года GitHub теперь поддерживает относительные ссылки в документах разметки.

Это означает, что ваш код ![ScreenShot](screenshot.jpg) теперь будет работать безупречно.

Как указано в @Brad, это также может облегчить сценарий, в котором изображения различаются в двух ветвях, но имеют то же самое. В этом случае переход из одной ветки в другую будет динамически переключать изображение в визуализированном представлении, таким образом, без каких-либо изменений в содержимом Readme.

Предыдущий ответ, когда GitHub не поддерживал относительные ссылки

Вы должны использовать формат raw url. В вашем случае это будет https://raw.githubusercontent.com/i-saumitra/Voice-controlled-MP3-Player/master/screenshot.jpg

Это означает, что правильная уценка будет следующей

![ScreenShot](https://raw.githubusercontent.com/i-saumitra/Voice-controlled-MP3-Player/master/screenshot.jpg)

Используя это в файле .md на github, отобразится следующее изображение: -)

Обновление после вашего комментария

где это официально указано, что мы должны использовать raw... я не мог найти его нигде

Этот формат URL-адреса является недокументированной функцией сайта GitHub. Это означает, что это может измениться позже. Если это произойдет, чтобы "вновь открыть" новый формат, нажмите кнопку Необработанные при отображении изображения. Это "откроет" изображение в вашем браузере. Скопируйте URL-адрес и Voilà!

Примечание. Хотя репозиторий больше не размещен на GitHub, я обновил URL-адреса, чтобы отобразить новый Политика GitHub относительно содержимого пользователя

Ответ 2

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

![ScreenShot](/screenshots/latest.png)

Предположим, что у вашего репо есть last.png внутри папки скриншотов.

~ В

Ответ 3

Для относительного URL-адреса для работы с изображениями оберните его внутри тега абзаца.

Я столкнулся с проблемой, особенно при работе с одним изображением.

Пример:

<p>
    <img src="relativePath/file.png" width="220" height="240" />
</p>

Ответ 4

Примечание: при использовании reStructuredText используйте:

.. image:: /screenshots/latest.png?raw=true

Ответ 5

Это может не относиться к предыдущим ответам. У меня тот же вопрос, что и у ОП - меня направили сюда, и он мне не помог. Я надеюсь, что смогу помочь пролить свет на этот вопрос, поскольку он охватывает возможности того, почему изображения не отображаются в файле README.md.

issue я столкнулся, состоит в том, что файл README.md именем файла записывается как readME

Мало того, что отсутствует .md также написано по-другому.

По-видимому, нам не следует переименовывать файл README.md. Это должно быть оригинальное имя этого файла, чтобы отобразить изображения или картинки, которые вы хотите загрузить на страницу github README.md. Надеюсь, это поможет кому-то, в редких случаях, так же, как я.

Ответ 6

Это очень просто

Просто загрузите ваше изображение в корень репозитория и укажите ссылку на имя файла без указания пути, например:

![your_image_name](your_image_name.png)