开发者

ASP.NET MVC loading of CSS based off of controller

Within my site I have controller specific CSS files in addition to my master css file. For example

CSS/
    Prodcuts/
             product.css
  开发者_开发知识库           ...
    Blog/
        blog.css
        ...
    masterStyle.css

Where masterStyle.css is the master css file. What I want to do is when the user hits http://www.example.com/Products/ only mySite.css and all css files under Products get included. What is the best way to go about doing this?


In your master page create the following placeholder inside the <head> section.

Master page

<asp:ContentPlaceHolder ID="HeadContent" runat="server"></asp:ContentPlaceHolder>

Then inside your controller you should determine the list of .css files to be used as well as create a string that the views can use to easily place the content inside the page. Here is what I've used.

Controller

public ActionResult Index()
{
    ViewData["Message"] = "Welcome to ASP.NET MVC!";

    List<string> css = new List<string>()
    {
        "one.css",
        "two.css",
        "three.css",
        "four.css"
    };

    IList<string> cssTags = new List<string>();

    StringBuilder cssTag = new StringBuilder();

    css.ForEach(c =>
        {
            cssTag.AppendLine(string.Format(@"<link href=""{0}"" rel=""stylesheet"" type=""text/css"" />", HttpUtility.HtmlEncode(c)));
        });

    ViewData["css"] = cssTag.ToString();

    return View();
}

Then inside your view just place the follwing

View

<asp:Content ID="headContent" ContentPlaceHolderID="HeadContent" runat="server">
<%= ViewData["css"] %>
</asp:Content>

The reason why I build up the list of .css inside the controller and then create a string that the view uses, is because I want the views to be as stupid as possible. An option would be to just place the list of .css files into the ViewData itself and then let the view do the looping and create the link tag, but it's better to do it elsewhere if possible.

Another option to using ViewData is to use a strongly typed view with a string property and then the view just picks that guy off. I personally don't use the ViewData dictionary. Instead all my views are strongly typed.


This is an interesting idea, I did a quick search and found this, let me know if it works. I like the idea.

ASP.NET MVC - style list item based on controller


Simple way could be to add a "custom.css" to each View subdirectory, and use this in the master page:

    <link href="/<%= ViewContext.RouteData.Values["Controller"]%>/custom.css" rel="stylesheet" type="text/css" />


Place ContentPlaceHolder in head section of your master page:

<head runat="server">
    <asp:ContentPlaceHolder ID="HeadContent" runat="server" />
</head>

Then you can place your styles in this content in views (or create another master page that inherits for main master page for every controller):

<asp:Content ID="ContentHeadContent" ContentPlaceHolderID="HeadContent" runat="server">
    <link href="custom.css" rel="stylesheet" type="text/css" /> 
</asp:Content>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜