How to add media attribute to ASP.NET MVC4 style bundle

Question

In ASP.NET MVC4 application, style bundle is created using

    bundles.Add(new StyleBundle("~/css/pos.css")
        .Include("~/css/mypos.css"));

and rendered in view as

@Styles.Render("~/css/pos.css")

Generated output in debug mode is

  <link href="/myapp/css/mypos.css" rel="stylesheet"/>

How to add media attribute to output so that style is used for screen

  <link href="/myapp/css/mypos.css" media="screen" rel="stylesheet"/>

or for print

<link href="/myapp/css/mypos.css" media="print" rel="stylesheet"/>

Or is there better way to to this, can media specified in css file or other solution ? jquery and jquery-ui are used.

Answer 1

Within your Razor page you would add the following:

<link href="@Styles.Url("~/css/pos.css")" rel="stylesheet" type="text/css" media="print" />