В asp.net.mvc, каков правильный способ ссылки на изображения внутри css
Я просматриваю сайт, и я вижу много разных соглашений о том, как образы ссылаются на CSS на сайте asp.net-mvc.
в том числе:
-
Полный путь:
.ddTitle span.arrow {
background: url('/content/images/dd_arrow.gif') no-repeat 0 0;
}
-
Относительное расположение по сравнению с местом нахождения css:
#cluetip-waitimage {
background-image: url(jQueryUI/images/ui-anim_basic_16x16.gif);
}
-
Относительно ".."
#cluetip-waitimage {
background-image: url(../../jQueryUI/images/ui-anim_basic_16x16.gif);
}
В asp.net-mvc, с маршрутизацией и т.д. Правильно ли это, а другие ошибаются или это просто предпочтение или соглашение? Предположим, что этот сайт может размещаться в общей среде с другими сайтами.
Ответы
Ответ 1
Ваш первый вариант отлично подходит, если ваше приложение всегда будет в корневой папке для веб-сайта (или, по крайней мере, ваши изображения все будут в корневой папке). Если у вас может быть другой путь в разных ситуациях (например, наличие общего сайта при разработке или тестировании), это не сработает.
Второй и третий варианты - это в основном одно и то же. Какой из них используется, полностью зависит от того, где изображения расположены относительно файла CSS. Я лично считаю, что второй выглядит более чистым, поэтому я пытаюсь помещать любые изображения, на которые ссылаются мои CSS файлы в структуре папок относительно того, где находится CSS. Тем не менее, некоторые люди предпочитают хранить все изображения в одном месте (даже смешивая контентные изображения с изображениями "хром" сайта), и для этого может потребоваться относительное перемещение с помощью ../, чтобы выполнить это.
Ответ 2
Обычно я делаю это так...
background-image: url('/jQuery/images/ui-anim_basic_16x16.gif');
Открытие / обозначает корневую папку, поэтому все ваши пути могут быть относительно корня программы, а не папки, из которой выполняется страница. Это добавляет немного ввода, но оно устраняет многие проблемы хеширования родительских элементов.
Итак, если ваши изображения были такими...
Ваш путь будет background-image: url('/content/jquery/images/ui-anim_basic_16x16.gif');
Выполнение этого способа устраняет большинство последствий любого рода путей. Поскольку ASP.NET как язык понимает концепцию относительных URL-адресов, это должно работать практически в любой ситуации, если сервер, на котором вы размещаете его, не имеет ничего очень неудобно настроенного - и в этом случае стандарты и методы не заставят вас слишком далеко.
Корневые относительные адреса также делают ваше приложение более модульным, по моему опыту. Здесь могут быть более опытные программисты, которые могут опровергнуть это по какой-то причине, но из всего, что я построил, делая все мои URL-адреса URL-адресов root-relative, позволил мне отбросить мою программу в любую папку и запустить ее без осложнений.
Ответ 3
У меня был аналогичный вопрос. Поскольку MVC позволяет использовать ~/(например, в представлениях бритвы) для обозначения корня приложения, я задавался вопросом, должно ли это быть сделано для путей изображения в моих файлах CSS.
Конечно, поскольку файлы CSS не обрабатываются на стороне сервера, это не сработает. Однако я считаю, что правильный путь - использовать относительные пути. Это должно быть хорошо, потому что путь к CSS файлу (в макете, например) может использовать ~/, а затем путь из файла CSS к изображению будет исправлен; и не имеет значения, где корень приложения... или если макет или основной вид находятся в другой области.
