HTML для самых маленьких #2 - относительные и абсолютные пути
Всем лучи добра, в прошлой статье я рассказал вам про язык HTML в целом. Кто еще не ознакомился - милости прошу. Заранее прошу прощения за картинки в тексте вместо листинга - редактор маркдаун все время пытается ссылку заменить даже внутри тега <code>
Сегодня, я расскажу вам про адресацию в web. Представьте, вы пришли в гости к другу и спросили его, где сахар.
> В моей квартире, на кухне, на столе, справа
Вы бы поняли, где сахар, находясь в любом месте, даже вне квартиры. Это пример абсолютного пути.
Или же друг мог бы сказать:
На столе, справа.
Это предложение выглядит короче, но оно не такое информативное. Вы бы нашли сахар, только если бы были в его квартире на кухне. Это пример относительного пути.
Другими словами, абсолютный путь - это полное указание до места назначения, а относительный путь - это короткое описание пути до места назначения, из места, в котором вы сейчас находитесь.
При верстке web страницы, вы можете столкнуться с обоими вариантами. Например, на вашем сервере есть папка example с таким содержимым
Вам нужно показать картинку из папки example/images/logo.png.
вы могли бы сделать это так
Браузер бы получил текущий путь страницы index.html и в этой директории бы искал папку images а в ней уже файл logo.png. Это относительный путь.
Но вы могли сказать браузеру сразу где искать картинку
Так браузер бы сразу попытался бы загрузить нужную картинку из указанного места, миную дополнительные обработки. Это пример абсолютного пути.
Надеюсь вы понимаете что такое корневой каталог? Если нет - это такая папка, выше которой подняться не получится. Как пример, тэг <html> из моего прошлого урока. Он корневой - все складывают в него, а его в свою очередь не могут положить никуда. Так вот, что бы обозначить путь от корневого каталога - нужно начать набирать адрес с символа / например, вернемся к прошлому примеру
тут я использовал конструкцию ./ что означает текущий каталог. А если бы я не указал точку, то браузер бы пытался найти путь от корневого каталога.
Двумя точками ".." указывают, что нужно подняться вверх по дереву каталогов. например, если бы я писал
то это означало бы, что я прошу браузер подняться на 1 уровень выше от текущего каталога и там искать папку images.
Что же друзья, сегодня мы разобрались с путями. Надеюсь было все понятно, если нет, то пишите комментарии - обсудим.
Спасибо за внимание
Подписывайтесь на мой блог и да прибудет с вами сила.