Question

我正在mvc4中构建一个应用程序。在写css的一种情况下，我必须像往常一样使用图像。

我面临的问题是我为css做的嵌套越多，就越需要使用“../”，因为我将图像保存在应用程序根目录的Images文件夹中，并将css保存在Content / themes / base / project中.webiste文件夹。

所以，这就是我的css。

.contact-form h1.contact-header
{ 
background:url(../../../../Images/contactform-head.png) no-repeat top left; width:113px;
}

我试图找到一些语义解决方案。我的意思是，而不是计算“../”这样有意义的东西，如：

.contact-form h1.contact-header { background：url（〜/ Images / contactform-head.png）左上角不重复;宽度：113px; }

OR

.contact-form h1.contact-header { 背景：@ Url.Content（Images / contactform-head.png）左上角不重复;宽度：113px; }

我甚至已经完成了其他一些stackoverflow解决方案并且做了很多但是没有成功解决我的问题。其中大多数是关于创建htmlhelper来解决图像的Url.Content。这解决了.cshtml文件或其他但不是.css的问题。如果有人能提出我正在寻找的解决方案，并且感谢所有其他人的时间，我将非常感激。

Answer 1

如果我是你，我会使用相对于项目根目录的路径。这样，文档在层次结构中的位置无关紧要。例如：

.contact-form h1.contact-header
{ 
  background:url('/images/contactform-head.png') no-repeat top left;
}

上面写的方式意味着在网站根文件夹中有一个名为images的文件夹，其中有一个名为contactform-head.png的文件。从哪里引用它并不重要（只要它在同一个域上）。它会工作得很好。

在css mvc4中的Url.Content概念实现

1 个答案: