Как указать путь к файлу в html

Относительные и абсолютные пути в HTML и PHP

Относительные и абсолютные пути в HTML (веб-адреса)

Абсолютные пути

В данном случае всё очень просто, мы указываем прямой путь к файлу, лежащему на другом домене. Возможно указание сокращенного пути через использование двух слешей в начале без явного указания http или https и сервер сам подставит нужный протокол (расширение) согласно настройке сервера. Важно заметить, что данный вид является необходимым для перехода между сайтами:

http://google.com

Относительно корня сайта

В данном случае браузер берёт домен сайта и к нему подставляет указанную ссылку. В данном случае получится http://school-php.com/css/style.css. В случае с http, https не надо париться, так как будет браться в том виде, в котором сейчас открыта страница, то есть при http будет http. Так же очень удобно для переноса некого функционала между разными сайтами или же перенос сайта с одного домена на другой не трогая код. Приоритетный способ указания путей к страницам и файлам.

Относительно данной страницы

Менее востребованный способ, так как он берёт нынешнюю страницу и к её пути дописывает новый адрес. То есть находясь на странице http://school-php.com/trick ссылка на файл будет иметь вид: http://school-php.com/trick/css/style.css . Практически невозможен в использовании в случаях, когда мы используем ЧПУ.

Использование тега base

В данном случае вместо стандартной подставки домена к относительному пути будет подставлен путь из base. То есть мы получим файл, располагающийся:

http://school-php.com/tricks/css/style.css

Относительные и абсолютные пути в PHP

Всё очень просто, работая в файловой системе мы будем придерживаться правил работы с путями в PHP. Если же мы передаём команду в браузер клиента, то тут используются пути HTML. То есть в следующем примере у нас из PHP передаётся путь браузеру с страницей, на которую ему надо перейти. То, что переход между страницами браузер осуществил можно увидеть в адресной строке:

header("Location: /page2.php");

Итого, открываем страницу page1.php, а в адресной строке записано page2.php, а всё дело в том, что браузер СНАЧАЛА загрузил страницу page1.php, а потом получил информацию с переадресацией и ЗАГРУЗИЛ страницу вторую page2.php. В данном случае переадресация была на стороне клиента (браузера), а значит используем правила относящиеся к HTML (веб-адрес).

Абсолютный путь в PHP

Абсолютный путь в PHP воспринимается как абсолютный путь от директории, в которой установлен веб-сервер. Данный путь можно получить из:

$_SERVER['DOCUMENT_ROOT']

Если взять в пример этот сервер, то его путь: /home/school/public_html/schoolphp , значит для того, чтобы указать полный путь к фотографии ‘/photo/img1.jpg’, необходимо указать такой путь:

getimagesize('/home/school/public_html/schoolphp/photo/img1.jpg'); getimagesize($_SERVER['DOCUMENT_ROOT'].'/photo/img1.jpg');

Хочу заметить, что сайт может располагаться в поддиректории, то есть для:

http://school-php.com/forum/

может быть крайне затруднительно использование DOCUMENT_ROOT, ведь форум (как внешний скрипт) ещё не знает где будет размещаться на сайте. Справиться с данной проблемой можно несколькими способами, давайте парочку перечислим:

1) Создать в виде поддомена страницу.

2) Прописать абсолютный путь в конфиге в config.php , то есть:

Core::$ROOT = $_SERVER['DOCUMENT_ROOT']; getimagesize(Core::$ROOT.'/photo/img1.jpg'); // используем абсолютный путь, который можно модифицировать

Теперь можно без угрызения совести привязать весь сайт на Core::$ROOT, и если случайным образом необходимо поменять путь до подключаемого файла, то можно переопределить значение Core::$ROOT;

Относительно стартового файла (базового)

Во многих системах index.php есть единая точка входа, то есть открывается index.php, а уже из него подключаются другие файлы.

include './modules/allpages.php';

В данном случае будет подключен allpages.php по пути: /home/school/public_html/schoolphp/modules/allpages.php . Данный способ удобен тем, что если прописать include в файле allpages.php: include ‘./modules/module/page.php’;, то искать его будет всё равно относительно точки входа, а именно index.php:

/home/school/public_html/schoolphp/modules/module/page.php

Достаточно удобная реализация учесть, что мы чётко знаем структуру нашего приложения относительно корневого index.php. Даже если мы вызываем любой другой файл, а не index.php, то работать пути будут абсолютно точно так же. Вызвали мы dir.php , значит относительно файла dir.php и будут браться пути!

Что ещё надо знать

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

include '../file.php';

В данном случае будет браться директория данного файла или корневого index.php, и возвращаться на 1 папку назад, там же будет искаться файл ‘file.php’.

DOCUMENT_ROOT не единственный вариант получить корневой путь сайта. Давайте взглянем в мануал: «Директория корня документов, в которой выполняется текущий скрипт, в точности та, которая указана в конфигурационном файле сервера.» . Это значит, что в случаях, если в конфигурационном файле будет некорректно написан путь, то весь сайт не будет работать. Что делать? Можно писать админам и владельцам хостинга, на котором размещается сервер с надеждой, что они исправят свои недочёты. Или искать стабильную альтернативу, которой является __DIR__ , это абсолютный путь к данному файлу, где запущен код файлу. Допустим файл конфигурации у нас лежит в папке config, и чтобы используя __DIR__ не возвращаться каждый раз на 1 папку наверх записью __DIR__’/../’ мы смело можем __DIR__ записать в свою переменную, примером ниже я записал в свойство класса (урок №24, кто не дошел используйте обычную переменную):

Core::$ROOT = __DIR__; // Или же для старых PHP - dirname(__FILE__);

Так же хотелось напомнить кое-что интересное и важное. Согласно безопасности веб-сервер запрещает перемещение по директориям выше корня сайта. То есть сайт находится по следующему пути: /home/school/public_html/schoolphp , но прочитать содержание папок /home, или /home/school будет недоступно.

Может ли PHP пользоваться путями HTML ? Да, в специальных функциях, для примера:

file_get_contets('http://school-php.com');

Практика

В своих старых проектах я использовал DOCUMENT_ROOT, сейчас перешел на относительные index.php пути ‘./папка/файл’.

Zend2, продукт от разработчиков PHP, один из самых сложных FrameWork на данный момент использует так же относительные пути с отличным синтаксисом от моего, то есть ‘папка/файл’.

Форум IPB.3 использует dirname(__FILE__).

Выводы:

1) В HTML используем пути относительно корня сайта, а именно ‘/file.php’ (Строка начинается со слэша).
2) в PHP используем относительно корневого файла ‘./file.php’ (Строка начинается с точки и слэша), альтернативой может быть использование свойства, инициализированного в корне: __DIR__;
3) Переадресация header использует пути из HTML. PHP работая с файловой системой (подключение файлов, сохранение и редактирование изображений) — с PHP путями.

Школа программирования © 2012-2023
imbalance_hero | inpost@list.ru , admin@school-php.com
account on phpforum | youtube channel

Абсолютный и относительный путь к файлу

На HTML странице часто приходится загружать различные файлы. Это ссылки на другие страницы, изображения, файлы стилей и другие. Чтобы файлы могли загрузиться, в коде страницы нужно указывать не только имя файла, но и его адрес. Существуют абсолютный и относительный путь к файлу. Рассмотрим их подробно.

Абсолютный путь к файлу

Абсолютный путь к файлу — это URL-адрес, например https://yandex.ru. Абсолютный адрес обычно используется для перехода на другой сайт. Внутри одного сайта тоже можно использовать абсолютный путь к файлу, но так редко делают, потому что это неудобно. Абсолютный адрес можно указать не только для главной страницы сайта, но и для любой доступной страницы. Узнать адрес любой страницы очень просто, он отображается в адресной строке браузера. Если Вам нужно указать адрес страницы, то нужно открыть страницу в браузере и скопировать её адрес из адресной строки.

Относительный путь к файлу

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

Самый простой вариант — это когда текущий и ссылаемый файлы находятся в одной папке. В этом случае нужно указывать только имя файла. Например ссылка на страницу page.html выглядит так:

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

Рассмотрим ситуацию сложнее — когда ссылаемый файл находится во вложенной папке относительно текущей страницы. В этом случае пишется имя папки, затем ставится слеш и имя файла.

Например, текущая страница находится в какой-то папке. Внутри этой папки есть папка myimages, а в ней картинка image.jpg. Добавим её страницу.

Может быть несколько уровней вложенности. В этом случае папки перечисляются через слеш от самой внешней до самой внутренней, а затем ставится имя файла. Например, в папке myimages находится папка newimages, а в ней уже находится картинка. Тогда картинка добавляется так:

Теперь рассмотрим обратную ситуацию — когда ссылаемый файл находится в более внешней папке относительно текущей страницы. Для перехода на более внешнюю папку ставятся две точки, затем слэш, затем имя файла.

Например, есть две папки, внешняя и внутренняя. Во внутренней находится наша страница, а во внешней находится страница page.html, на которую нужно сделать ссылку.

Есть ещё один способ указания относительного пути к файлу — это путь относительно корня сайта. То есть, самой внейшней папки сайта. В этом случае не имеет значения, где находится текущая страница. При таком способе сначала ставится слеш, а затем путь к файлу. Такой способ работает только на сервере. Для обычной папки на компьютере он работать не будет.

Например, если файл page.html находится в корне сайта, то независимо от расположения текущей страницы, ссылка на него выглядит так:

Если в корне сайта есть папка dir, а в ней уже файл, то ссылка на файл выглядит так:

Коприрование материалов сайта возможно только с согласия администрации

2017 — 2023 © basecourse.ru Все права защищены

Как правильно указывать пути в html css?

Спокойно. Писать пути я умею. Мне интересно, как правильно навести «порядок в файлах», не запутаться и не создавать сотни папок (дублировать тоже не охото).

Пример:
У меня есть директория puplic_html, и вот пошли файлики(порядок написанного не соответствует сортировке):
css
fonts
php
js
services
img
index.html

В папке «services» лежат папки с сайтами услуг
как мне правильно приписывать пути к папке img js php в корне ?
Я писал так: img src=»https://qna.habr.com/q/.%20/img/icons/nameicon.png» alt=»»

но шота не работает. как правильно?

• Вопрос задан более трёх лет назад
• 8363 просмотра

2 комментария

Простой 2 комментария

Анатолий уже ответил, немного структурирую информацию, может кому пригодиться. Нужно отличать пути в файловой системе и на сайте (через веб-сервер). У каждой файловой системы есть корень — это / (слеш), если путь начинается со слеша, это абсолютный путь от корня файловой системы, если начинается не со слеша, это относительный путь (относительный — потому что относительно текущего положения файла). Относительные пути могут начинаться с ../ и ./ — вариант с двумя точками это выход на уровень выше, вариант с одной строкой — это аналогия как я без ничего, то есть в текущей папке.

Зачем нужны относительные пути? Чтобы укоротить путь или убрать зависимость от места хранения файлов, пример: Вы разрабатываете сайт, некоторые статические файлы лежат глубоко в папке с названием пакета, номера версии, юзера, мы прописали в скрипт картинку, скрипт находиться в папке /static/vasya/script — а прописанный абсолютный путь от корня веб-сервера картинки /static/vasya/images, в конце vasya — это автоматически созданные папки пользователей, этот Вася меняет логин на supervasya — по какой-то причине у Вас создан функционал, который переименовывает папки юзеров при изменении логина. И получается что путь изменился и картинка больше не работает (если путь не меняется автоматом), чтобы такой ситуации не было можно использовать просто относительные пути, так как папки script и images находятся в одной папке (/static/supervasya) то просто водим на один уровень выше и заходим в папку images и получаем наш файлик, то есть проще и работать будет всегда (если папки относительно друг друга не менялись). Относительный путь выглядеть будет так ../images.

История с абсолютными путями веб-сервера выглядит похожим образом, нужно запомнить, что / (то есть корень сайта) это та папка, которую мы прописываем в конфиге как root, то есть если корень веб-сервера /var/www/site.name/web то картинка picture.jpg, которая лежит в папке /var/www/site.name/web/images/ на сайте всегда. будет иметь вид /images/picture.jpg вне зависимости от того в какой папке находиться файл, где будет прописан этот путь, повторюсь — это все потому что путь начинается со слеша.

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

Теперь, почему абсолютные пути сайта не работают в файловой системе на компе разработчика, все очень просто — корень веб-сервера это папка внутри проекта, а когда мы открываем хтмл файл вне веб-сервера, мы имеем дело с корнем той файловой системы где это лежит, то есть от корня диска и поэтому пути не совпадают, поэтому всегда веб-разработку начинайте с установки веб-сервера (denwer, openserver, vagrant или docker с установленными веб-серверами и т.п.). Знания того как это работает когда-нибудь да пригодятся, особенно когда начнёте копать куда-то глубже чем верстка (а копать рано или поздно начнёте). Работать без веб-сервера можно, но нужно понимать специфику и понимать, что иногда в очень крайних случаях могут быть ошибки типа не сработает images/pictures.jpg, но сработает ./images/picture.jpg, почему так? Разные ОС, версии пакетов, особенности разных веб-серверов и фаз Луны и дня в женском календаре жены ведущего разработчика пакета, который пять лет не менялся и все работало, а потом внезапно сделал рефакторинг без изменения функционала и пути сломались. Ну в общем Вы поняли

Как указать путь к файлу в html

Абсолютные и относительные ссылки. Как указать путь к файлу правильно Абсолютные ссылки всегда начинаются с имени протокола. Например http:// и содержат имя файла.

Относительные — ведут отсчет от корня сайта или текущего документа.

При обращении к каталогу без явного указания названия файла (то, что пишется в конце, после /fail.html) обычно открывается индексный файл — index.html. Это стоит помнить, чтобы всегда вы могли защитить свой сайт от мошенников. Об этом я рассказываю в настройках WP.

Абсолютные ссылки обычно применяются для указания документа на другом сетевом ресурсе, впрочем, допустимо делать абсолютные ссылки и внутри текущего сайта. Однако подобное практикуется нечасто, поскольку такие ссылки достаточно длинные и громоздкие. Поэтому внутри сайта преимущественно используются относительные ссылки.
Если вы забыли как правильно написать ссылку в коде , то следует вернуться к этому посту.
Рассмотрим создание относительных ссылок более подробно.

Вариант 1 Фалы располагаются в одной папке?

Здесь все просто. Нужно сделать ссылку из исходного на ссылаемый. То есть вот так:

Здесь путь такой

Здесь нужно выйти — ../ из одной и второй ../ папки и там уже найти файл

Как видите, ничего трудного нет в этом, если знать, как правильно обозначить путь к файлу.

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

Зато на компьютере вообще все проще простого.

Сейчас я вам расскажу пару фишек о том, как легко и точно прописать путь к файлу.

1. Выбираете нужный вам файл
2. Зажмите кнопку Shift и щелкаете правой кнопкой мыши.
3. В открывшемся меню выбираете копировать путь к файлу.
4. Вставляете сразу после = без кавычек. Они подставятся автоматически.

Если вы пользуетесь командной строкой на компьютере. Лично у меня она даже закреплена в панели задач. То..

1. Открываете командную строку
2. Просто перетаскиваете туда нужный файл
3. Получаете точный путь к вашему файлу. Копируйте и наслаждайтесь!

На этом все на сегодня. Хочется добавить. что при создании папок и файлов не стоит пользоваться кириллицей и тем более пробелом, или разными регистрами символов.
Пробуйте, экспериментируйте и делитесь своими «фишками» и «кейсами».

Хотите освоить самые современные методы написания React приложений? Надоели простые проекты? Нужны курсы, книги, руководства, индивидуальные занятия по React и не только? Хотите стать разработчиком полного цикла, освоить стек MERN, или вы только начинаете свой путь в программировании, и не знаете с чего начать, то пишите через форму связи, подписывайтесь на мой канал в Телеге, вступайте в группу на Facebook.