Я храню таблицы стилей в {root} / styles, а изображения в {root} / images для веб-сайта. Как указать путь в таблицах стилей для поиска указанных изображений в каталоге изображений?
например, в background-image: url('/images/bg.png');
Ответы:
Используйте ..для указания родительского каталога:
background-image: url('../images/bg.png');Вот все, что вам нужно знать об относительных путях к файлам:
Начиная с, / возвращается в корневой каталог и начинается там
Начиная с ../ перемещает на один каталог назад и начинается там
Начиная с ../../ перемещает два каталога назад и начинается там (и так далее ...)
Чтобы двигаться вперед , просто начните с первого подкаталога и продолжайте двигаться вперед.
Щелкните здесь, чтобы узнать больше!
Использование ../:
background-image: url('../images/bg.png');Вы можете использовать это так часто, как хотите, например, ../../images/или даже в разных позициях, например ../images/../images/../images/(как, ../images/конечно)
В Chrome, когда вы загружаете веб-сайт с некоторого HTTP-сервера, работают как абсолютные пути (например /images/sth.png), так и относительные пути к некоторому каталогу верхнего уровня (например ../images/sth.png).
Но!
Когда вы загружаете (в Chrome!) HTML-документ из локальной файловой системы, вы не можете получить доступ к каталогам над текущим каталогом. Т.е. вы не можете получить доступ ../something/something.sthи изменить относительный путь на абсолютный, иначе ничего не поможет.
../действительно работают нормально - или, по крайней мере, работают нормально в этом конкретном случае!
Предположим, у вас есть следующая файловая структура:
-css
--index.css
-images
--image1.png
--image2.png
--image3.pngВ CSS вы можете получить доступ image1, например, с помощью строки ../images/image1.png.
ПРИМЕЧАНИЕ . Если вы используете Chrome, он может не работать, и вы получите сообщение об ошибке, что файл не может быть найден. У меня была такая же проблема, поэтому я просто удалил всю историю кеша из Chrome, и это сработало.
Если вы храните таблицы стилей / изображения в папке, чтобы их могли использовать несколько веб-сайтов, или вы хотите повторно использовать одни и те же файлы на другом сайте на том же сервере, я обнаружил, что мой браузер / Apache не позволяет мне перейти на любая родительская папка над корневым URL-адресом веб-сайта. Это кажется очевидным из соображений безопасности - нельзя просматривать на сервере любое место, кроме указанных веб-папок.
Например. не работает: www.mywebsite.com/../images
В качестве обходного пути я использую символические ссылки:
Перейдите в каталог www.mywebsite.com Выполните команду ln -s ../images images.
Теперь www.mywebsite.com/images будет указывать на www.mywebsite.com/../images