how to add an image to the background of the master page

Question

0.00/5 (No votes)

See more:

Actually i am having two master pages. and i am developing a web application in that i want to add image to the background of the two master pages

//bellow i am giving login master-page code.

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>School Apps</title>
<asp:ContentPlaceHolder ID="head" runat="server">

<style type="text/css">
.style1
{
width: 250px;
}
.style2
{
width: 980px;
}
.style3
{
width: 958px;
}
</style>
</head>
<body>
<form id="form1" runat="server">

style="background-color: white;"
class="style2">
<%----%>


style="border: 1px solid #000000"> <asp:Label ID="lblWelcome" runat="server" Font-Bold="True" Font-Size="medium" ForeColor="#990000" Text="Welcome "> <asp:Label ID="lblWelcomeUser" runat="server" Font-Bold="True" Font-Size="Small" ForeColor="#990000" Text="..."> \| <asp:LinkButton ID="lbtnLogout" runat="server" Font-Bold="true" Font-Size="Medium" ForeColor="#3333CC" onclick="lbtnLogout_Click">Logout
style="border: 1px solid #000000" class="style1">	style="border: 1px solid #000000" class="style1"> <asp:ImageButton ID="imgbtnEnguiryForm" runat="server" Height="44px" Width="161px" onclick="imgbtnEnguiryForm_Click" ImageUrl="~/images/imk.jpg" /> <asp:ImageButton ID="imgbtnAdmission" runat="server" Height="44px" Width="161px" ImageUrl="~/images/add.jpg" /> <asp:ImageButton ID="imgbtnFeeCollection" runat="server" Height="44px" Width="161px" ImageUrl="~/images/cel.jpg" /> <asp:ImageButton ID="imgbtnReports" runat="server" Height="44px" Width="161px" ImageUrl="~/images/rep.jpg" /> <asp:ImageButton ID="imgbtnClassRoom" runat="server" Height="44px" Width="161px" ImageUrl="~/images/class.jpg" /> <asp:ImageButton ID="imgbtnSMSPlugin" runat="server" Height="44px" Width="161px" ImageUrl="~/images/Sms.jpg" /> <asp:ImageButton ID="imgbtnLeads" runat="server" Height="44px" Width="161px" ImageUrl="~/images/leads.jpg" /> <asp:ImageButton ID="imgbtnCallenderEvent" runat="server" Height="44px" Width="161px" ImageUrl="~/images/cal.jpg" />	<asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
style="border-style: solid none none none; border-width: thin" bgcolor="white"> <asp:Label ID="lblFooter" runat="server" Text="" Font-Bold="true" ForeColor="#EFCEFF">

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

Posted 4-Feb-13 18:02pm

ntitish

Updated 4-Feb-13 18:05pm

v2

Add a Solution

6 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

sunil mali · Answer 1 · 2013-02-04T18:13:00

Solution 1

Hi,
Its Very Simple
ctrl+shift+a Add new item
select Stylesheet

add below code to your style sheet

C#

body
{
    background-image: url('../Images/forrest_guitar_2-wallpaper-2400x1350.jpg');
}

give reference of style sheet in master page

<link href="CSS/StyleSheet.css" rel="stylesheet" type="text/css" />

Posted 4-Feb-13 18:13pm

sunil mali

Comments

ntitish 5-Feb-13 0:38am

sir you are saying to take new page....for this background image.. i am not getting properly...

sunil mali 9-Feb-13 1:12am

Yes add new page stylesheet and copy
body element as it is to your stylesheet
and then in your master page add link attribute in your head section
i mean to say inside your head tag... you just,try it seriously its very easy .... just for you i did this and posted in such easy way.....

ntitish 11-Feb-13 0:42am

thanks sir...

sunil mali 11-Feb-13 1:23am

Please mark it as answer if you are ok with it...

joe_j · Answer 2 · 2013-02-04T18:57:00

Solution 4

In the MasterPage.master page add the below code into the <head></head> region

HTML

<link href="Style.css" rel="stylesheet" type="text/css" /><pre lang="CSS">

Then create a .Css file with the name "Style.css" and drop it into the folder where the masterpage is.
In the Style.css add the below line

CSS

body
{
    background-image: url('image.jpg');
}

If you do have any doubts please let us know.

Posted 4-Feb-13 18:57pm

joe_j

Comments

ntitish 5-Feb-13 1:10am

//i am confused to apply where and where...if u dont mind can u guide me...
//below is my code.

<head runat="server">
<title>School Apps</title>
<asp:ContentPlaceHolder ID="head" runat="server">

<link href="style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.style1
{
width: 250px;
}
.style2
{
width: 980px;
}
.style3
{
width: 958px;
}
body
{
background-image:url('~/images/testing.jpeg');
}
</style>
</head>
<body>
<form id="form1" runat="server">

//in this the form code is there which i posted under the question

</form>
</body>

joe_j 5-Feb-13 1:22am

sure not a problem. is the above code inside your masterpage?

ntitish 5-Feb-13 2:01am

yes sir....

joe_j 5-Feb-13 2:06am

ok, then if you are trying with the above code, you do not need to put this <link href="style.css" rel="stylesheet" type="text/css" /> as you have already specifying the CSS within your masterpage itself <style type="text/css">.....</style>
So first take off the <link href=...../> part
Then check if the image file "testing.jpeg" actually exists and is in the "images" folder.

sunil mali · Answer 3 · 2013-02-04T19:58:00

Solution 6

<pre lang="cs">body
{
background-image: url('image.jpg');
}</pre>

put this inside your style of your page
and also keep some good image in images folder with same name

Posted 4-Feb-13 19:58pm

sunil mali

Comments

ntitish 5-Feb-13 2:35am

ok i got it thanks....

sagarjainhr · Answer 4 · 2013-02-05T01:13:00

XML

<center>
              <table width="1024">
              <tr><td width="100%">
                  <asp:Panel ID="Panel1" runat="server" Width="100%" Height="150px"
                      BackImageUrl="~/Images/front2.jpg">
                  </asp:Panel>
              </td></tr>
        </table>

balu katuri · Answer 5 · 2013-02-04T18:15:00

Solution 2

first upload image to your website....goto->properties->background you can choose background property your image...try it once.

Posted 4-Feb-13 18:15pm

balu katuri

balu katuri · Answer 6 · 2013-02-04T18:18:00

Solution 3

Other wise

goto masterpage design press F4 choose background import image

Posted 4-Feb-13 18:18pm

balu katuri

Comments

ntitish 5-Feb-13 0:28am

i am not having that option in my properties window..........i am using 2008 visual studio ...

how to add an image to the background of the master page

6 solutions

Solution 1

Solution 4

Solution 6

Solution 7

Solution 2

Solution 3

Add your solution here

Preview 0

Existing Members

...or Join us