Apply Styles with Html Helpers in MVC4 Razor

we can apply style in two ways

  • using Inline
  • using Class

Using Inline CSS

It can be achieve by following code

@Html.TextBox(“Name”, “”, new{style = “width:80px;height:20px;background-color:#F0F0F0 ;”})

using CSS Class

we need to add class name by using @class like as

.txtbox {
width: 100px;
height: 75px;
background-color: #F0F0F0;
border:1px solid black;
}

We can apply the class name using @class

@Html.TextBox(“txtName”,””, new{@class = “txtbox”})


Note :

Correct Method of using:

@Html.TextBox(“txtName”,””, new{@class = “txtbox”})

Wrong Method

@Html.TextBox(“txtName”, new{@class = “txtbox”}) – It will not apply the style to the textbox

In above code new{@class = “txtbox”} want to be third parameter , if no value to second parameter then we must pass null/Empty value.

Output:

Inline style for textbox

Advertisements
By Sriramjithendra Posted in ASP.NET

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s