mvc3 razor, CSS in Helper

In an mvc 3 razor project I have a helper which creates a component. I can use this helper to create as many components as I need in the same page.

I have different folders containing css files and their images.

Can I specify the css style of each component from the helper?

i.e @html.MyComponent(100, 200, "pink") will uses the style.css in pink folder.

Ps: I am not using html5 neither css3


ANSWERS:


If you would use classes instead of files it would be much easier. I would just use different styles for themes. You should look at this question: ASP.NET MVC 3, how to do themes right


ASP.NET MVC 3 Razor: Include JavaScript file in the head tag

I think the same thing can be applied but I don't know if you can do it from a helper.


If you are set on doing it this way - then

  1. You need to select the css file at the top for pink
  2. You need to include all style sheets in loading.
  3. You need to dynamically include style sheets when requested by MyComponent. This is tough as you may end up double including them. You can accomplish this via an ActionFilter to write out the css tags at the end, but this is a hack and I wouldn't recommend it.

Stick with convention and your styles should be requested at the top, so you need to know which styles you are using on the page. Your components shouldn't care about loading a style sheet, it should already be loaded which means you have to make this decision at the top of your page. Since you should already 'know' the names at this point (pink, etc) you can easily write the code at the top to request these files via a simply


<LINK href=""/{0}/style.css",YourStyleSheetnameIePinkInThisExample)" rel="stylesheet" type="text/css">



 MORE:


 ? "Tag is missing a name" with Razor
 ? MVC3 Razor - Adding JavaScript and CSS files to document head
 ? asp.net-mvc: razor '@' symbol in js file
 ? Razor with javascript issue
 ? Razor Tags in Included Javascript (in Separate File)?
 ? Injecting content into specific sections from a partial view ASP.NET MVC 3 with Razor View Engine
 ? Injecting content into specific sections from a partial view ASP.NET MVC 3 with Razor View Engine
 ? Injecting content into specific sections from a partial view ASP.NET MVC 3 with Razor View Engine
 ? Using Render Section script on MVC
 ? Using sections in Editor/Display templates