<MyRusakov.ru />

Профессия Web-разработчик

Профессия Web-разработчик

Этот комплект за 8 месяцев превратит Вас в Web-разработчика с нуля. Учиться достаточно 1 час в день.

Начнёте Вы с HTML, CSS и вёрстки сайтов. Потом перейдёте к программированию и JavaScript. Затем изучите PHP, MySQL, SQL, Python. Изучите Web-фреймворки Laravel и Django. Создадите 5 своих сайтов для портфолио.

Комплект содержит:

- 540 видеоуроков

- 110 часов видео

- 1205 заданий для закрепления материала из уроков

- 5 финальных тестов

- 7 сертификатов

- 12 Бонусных курсов

Подробнее
Подписка

Подпишитесь на мой канал на YouTube, где я регулярно публикую новые видео.

YouTube Подписаться

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Какая тема Вас интересует больше?

Почему не отображается картинка на сайте?

Почему не отображается картинка на сайте?

Давно я уже не писал ничего для новичков, в основном, пишу уже для достаточно опытных специалистов. Поэтому чтобы исправить это положение, я решил написать статью по теме наиболее частого вопроса, который я постоянно получаю: "Почему не отображается картинка на сайте?". В этой статье я постараюсь разобрать все причины, почему изображение не появляется на сайте на основании того, что я видел у своих учеников.

Не будем тянуть резину, а сразу перейдём к делу.

Первая ошибка

<img scr="image.jpg" alt="Картинка" />

Тот, кто уже хорошо знает HTML, мгновенно найдёт в данном коде ошибку. А ошибка здесь синтаксическая, так как атрибута "scr" не существует, а правильно писать "src". Ошибка очень распространена, поэтому я решил её поставить первой.

Вторая ошибка

<img src="image.jpg" alt="Картинка" />

Здесь никаких ошибок в коде не имеется, однако, если копнуть глубже, то название картинки, скорее всего, указано неправильно. Очень часто в ОС отключён показ расширений файлов, как следствие, image.jpg - это только имя файла, без расширения. Для решения проблемы надо включить показ расширений файлов в свойстве папок, далее увидеть, что файл называется, например, так: "image.jpg.png", и это имя прописать в src.

Третья ошибка

<img src="image.jpg" alt="Картинка" />

Снова код правильный, однако, картинка всё равно не отображается. Если не помог предыдущий пункт, то, скорее всего, в браузере просто отключён показ картинок. Включите показ картинок в браузере, и Ваше изображение должно будет появиться.

Четвёртая ошибка

<img src="images/image.jpg" alt="Картинка" />

Очень часто ошибка состоит в том, что путь написан с ошибкой. А этот путь они просто откуда-то сдирают (с моего сайта, с книг, с моих курсов или ещё откуда-нибудь), не подумав о том, что это только путь, а не сама картинка. И по нему должна находиться само изображение. В большинстве случаев, её и близко нет. Иногда картинка имеется, но путь написан неправильно. Здесь надо просто уметь писать относительные пути. Начинается всё от каталога, в котором находится данная страница, далее пишем каталог, в котором находится картинка, а затем через слеш пишем название картинки. Если есть ещё один каталог на пути к картинке, то пишем и его (например, так: "images/photo/user1.jpg"). Если сама страница находится во внутреннем каталоге, также как и картинка, то нужно использовать "../" (например, так: "../images/image.jpg"). Всё просто, но вот возникают почему-то проблемы.

Я разобрал все ошибки, которые мне удалось вспомнить в своей практике. Если у Вас не отображается картинка на сайте, то 99.9% того, что решение Вы найдёте здесь, поэтому внимательно просмотрите всю статью и подумайте, что у Вас не так. И всегда помните, что ошибка может быть комплексной. Например, синтаксическая ошибка, путь указан неверно, да и имя неправильно написано. Такое тоже бывает, поэтому проверяйте себя на каждой ошибке, и после их исправления картинка обязательно появится на Вашем сайте.

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Комментарии (26):

avb-intik avb-intik 08.05.2012 06:09:06

Есть еще 5-я ошибка. У вас примеры написаны так, что можно подумать что между первой угловой скобкой и тегом img стоит пробел. Тогда как между этой угловой скобкой и тегом img пробел не допускается.

Ответить

Admin Admin 08.05.2012 13:03:58

Это всё относится к синтаксическим ошибкам. Ещё можно такую ошибку допустить: s rc. Или такую: jmj вместо img. Не писать же о каждом символе.

Ответить

felix felix 25.08.2016 21:34:33

зд. у меня такая проблема картина не отображается только значки ее что эта может быть я учусь спасибо за внимание <img src="/img/4.jpg">

Ответить

kan2170 kan2170 21.05.2012 13:48:50

Никак не получается разместить. Все сделал как Вы говорите. Может я не правильно сохранил картинку ? <img src = "kan.logo.jpg" alt = "Картинка" width = "150" height = "150"/>

Ответить

Admin Admin 21.05.2012 13:54:03

Странное название, попробуйте изменить, хотя ещё раз повторю, все проблемы описаны выше.

Ответить

sync.o sync.o 02.06.2012 09:58:07

По поводу пути к картинке: на мой взгляд, лучше всегда указывать путь с корня сайта и начинать его со слеша: src="/images/image.jpg". Тогда картинка будет доступна с любой страницы сайта, на каком бы уровне и подуровне она не находилась. То же самое касается указания путей к css и js-файлам.

Ответить

Frederico Frederico 17.10.2012 17:26:47

Я делаю как Вы говорите, а у меня все равно не получается. Размер картинки имеет значение?

Ответить

Admin Admin 17.10.2012 18:27:11

Нет, не имеет. Проверьте ещё раз, как правило всё из-за какой-нибудь мелкой ошибки.

Ответить

last_andrei last_andrei 08.05.2013 22:50:19

Здравствуйте. Хотелось бы спросить вашего совета: на сервере картинки исправно загружались,однако после залива на сервер ещё одного файла картинки на одной из страниц перестали отображаться. Картинки находятся в одной папке, названия я все перепроверял... т.е. ни один из вышепредложенных вариантов мне не подходит, на мой взгляд. Можете ли вы что либо посоветовать? Заранее спасибо.

Ответить

Admin Admin 09.05.2013 11:05:35

Попробуйте в другом браузере посмотреть. Если не заработает, то где-то Вы просто что-то сделали не так, чудес не бывает, чтобы из-за одной картинки все другие пропадали.

Ответить

Gitara200026 Gitara200026 17.08.2013 18:36:06

У меня не по поводу картинок)) я создал веб сайт,а в браузере не нечего нету((( просмотрел исходный код,а там нечего нету,почти

Ответить

Marking Marking 18.09.2013 18:51:24

Здравствуйте Михаил! У меня проблема с картинками на сайте.Они не отображаются я прочитал эту статью но тем не менее картинки все равно не отображаются хотя делаю вроде всё правильно: <img src="images/my saite.png" width="100%" alt="Шапка сайта"/> Подскажите что не так!!!

Ответить

GALAPERIDOL GALAPERIDOL 01.11.2013 15:40:48

скорее всего не правильно имя файла <img src="images/my saite.png"> Пробел недопустим! <img src="images/mysaite.png">

Ответить

alekspro_shell alekspro_shell 10.04.2014 01:36:02

Испробовал все перечисленные выше варианты, ну ни чего не помогает. (<img src = "images/logo.jpg" width = "100%" alt = "Шапка сайта" />)

Ответить

daniil766711 daniil766711 27.05.2014 17:53:16

Смотрите вы пишите <img src="saite.png"> A надо покозать путь НАпримеp- диск- папка- картинка <img src="E:\papka\img\domnk.png">

Ответить

daniil766711 daniil766711 02.06.2014 17:01:33

У меня все получилось

Ответить

Che777 Che777 23.06.2014 13:10:53

Здравствуйте Михаил! У меня проблема с размером картинки, не могу задать её высоту, <img src="images/images.jpg" alt="Шапка сайта" width="100%" height="50%"/>, т.е. как бы не менял значение по высоте, картинка остается неизменной и очень большой.Почему?

Ответить

tikkiwiki tikkiwiki 25.06.2014 09:52:21

Потому, что нужно задавать размер в px, чтобы не потерять качество. Так как % - это мера относительно чего-то.

Ответить

Che777 Che777 25.06.2014 11:19:29

Спасибо тебе добрый человек!!

Ответить

acmpis acmpis 11.09.2014 23:26:03

Еще зависит от браузера. У меня например тоже не отражало картинку в опере. Никаких ошибок в коде не было. Проблема была в том, что названия папок были на кириллице. Если у кого тоже путь к картинке на кириллице то переименуйте папку на англ. слово.

Ответить

Landau_1965 Landau_1965 29.09.2015 23:30:17

картинку тоже не мог вставить около часа , проблема была в названии картинки и пути где находилась картинка. выход нашёл вот как ,вставил адрес пути картинки как мне показал браузер Мазила вот она file:///C:/site/images/Hydrangeas.jpg в общем получилось вот что <img src="file:///C:/site/images/Hydrangeas.jpg" title="картинка" height="100" alt="Картинка" /> вот ещё что Hydrangeas.jpg это название картинки которое прописывается в свойствах файла , без этого названия ничего не выходит . ну у вас будет своё название , всем удачи , проверяйте пути и названия картинок

Ответить

write2sd write2sd 13.02.2016 23:53:31

Здравствуйте Михаил тоже не отображается картинка перепробовал все варианты не знаю что делать <img srс = "file:///D:/html/1.jpg" alt = "Картинка" width = "100" height = "100">

Ответить

P_Sh P_Sh 19.04.2016 19:51:55

C картинками беда. Не знаю как узнать, включен в браузере показ картинок или нет. Все остальное пробовал, не помогло. А могут разниться коды, картинки и моего сайта?

Ответить

VASJA VASJA 14.06.2016 13:31:09

А вот еще в тему: в IE, FF и Chrome картинка есть, а в Opera НЕТ!!! Только замещающий текст. <td width="660"><a href="index.html"> <img src="OF/LOGO.png" alt="Картинка" width="397" height="75" /></a></td> ПРОСЬБА ПОДСКАЗАТЬ!! ЧТО ЭТО МОЖЕТ БЫТЬ?

Ответить

Егор2048 Егор2048 18.03.2020 02:34:35

Ребят помогите пожалуйста пробовал по разному но не получается вот код: <html> <body> <img scr="file:///C:/Users/egord/Desktop/im.jpg"/> </body> </html> размеры не задаю потому-что они уже такие которые нужны. сам проверял по ссылке переходит всё норм но чёт не отображается

Ответить

RoKKON RoKKON 23.04.2020 18:17:56

Если ещё актуально-нужно попробовать обновить Java

Ответить

Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.