ASP.NET MVC - Adding CSS to your view (inside of the view not an external .css file)

Question

I am new to ASP.NET MVCs. I want to ask if there is a way to add CSS inside your view, but not using an external .css file? For example: table {border: 5px solid red;} (Just like you would do it in a normal HTML-CSS project)?

Assuming you chose the default Razor view engine, it's still just basically html, so you can do whatever you want. — Yuriy Faktorovich, Mar 06 '17 at 19:14
@YuriyFaktorovich yes I use Razor ... Still if i write `table, td, th { border: 5px solid red; }` I get it written on my page... like normal text — john, Mar 06 '17 at 19:19
@YuriyFaktorovich oh haha, now I see that I missed it, thanks — john, Mar 06 '17 at 19:41

score 15 · Answer 1 · answered Mar 06 '17 at 21:05

Consider using sections. In your layout add:

<head>
    ...
    @RenderSection("Styles", required: false)
</head>

Then, in your view:

@section Styles
{
    <style type="text/css">
        table { border: 5px solid red; }
    </style>
}

This will have the effect of adding this style tag into the head of your HTML where it should be, instead of littering style tags throughout your code.

Murat Yıldız · Answer 2 · 2023-01-25T14:05:47.367

4

You can also define CSS in razor view by using style tag as shown below:

<style>
    table {border: 5px solid red;}
</style>

edited Jan 25 '23 at 14:05

answered Mar 06 '17 at 19:57

Murat Yıldız

11,299
6
63
63

score 1 · Answer 3 · answered Mar 06 '17 at 19:58

1

Some like this.

@Html.Label("Hello World",new{@style="your style code"})

answered Mar 06 '17 at 19:58

ASP.NET MVC - Adding CSS to your view (inside of the view not an external .css file)

3 Answers3

Linked