How to keep image as background image in master page?


Recently i was keeping Image as background in master page of one of my persnal project . Firsly i was implementing the direct approach to do this task. But in master page, directly we cant keep the image as background image.

Here is some trick to do this task

Steps 1: Create the master page as per as your requirement

Step2 : In div keep the img background syntax like this

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="Imgae_BackGround_MasterPage.Site1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head runat="server">
<title></title>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div style="background-image: url('<%= imgPath %>') " >
<br />
<br />
<b style="font-style: italic; color: #fff"> This is the Header menu part of master page</b>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

</asp:ContentPlaceHolder>
<b style="font-style: italic; color: #fff"> This is the Footer menu part of master page</b>
<br />
<br />
</div>

</form>
</body>
</html>

Step3: Write the code in code behind of master page like this

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Imgae_BackGround_MasterPage
{
public partial class Site1 : System.Web.UI.MasterPage
{
public string imgPath = System.Web.VirtualPathUtility.ToAbsolute("~/Img/Hydrangeas.jpg");

protected void Page_Load(object sender, EventArgs e)
{

}
}
}

Step4: Now create the content page and compile it.

I hope it will help to some one

Advertisements

2 Responses to “How to keep image as background image in master page?”

  1. RAFFI.SHAIK Says:

    good dude

    • Chandra Dev Says:

      Thanks.


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

%d bloggers like this: