Member Avatar for Sadia fatima

what should i write in the body tag so background image does not repeat??

<body background="images/red-and-black-powerpoint-template.jpg">

  • 7 Contributors
  • 10 Replies
  • 3K Views
  • 3 Weeks Discussion Span
  • Latest Post Latest Post by sania khan

Recommended Answers

All 10 Replies

Member Avatar for hericles

If you need it to repeat in one direction only use:

background-repeat: repeat-y (or repeat-x)

If you want it to not repeat at all use

background-repeat: no-repeat;

This should be placed in the CSS file rather than entered as in-line style. Add it inside the body {} section.

Edited by hericles because: added more detail
Member Avatar for JorgeM

So, I would also suggest that you stay away from setting these values via HTML attributes and use CSS properties.

In the example above, you can apply this via a style sheet:

body {
background-image:url('image.jpg');
background-repeat: no-repeat;
}
Member Avatar for chunkbar

both of these methods are not working in our project we hav tried both of them.we want to remove background repeatetion in extreme right of our project interface >:(

Member Avatar for motrack

You need to place the style information in your code at the right place.

Either do as the examples above (add the style in-between <head></head> or separate css file.

OR:

<body style="background-image:url('image.jpg'); background-repeat:no-repeat">
.... rest of html
</body>

----------------------------------------------------------------------------------
pirates game

Edited by motrack
Member Avatar for sania khan

<body style="background-image:url('image.jpg'); background-repeat:no-repeat"> is not removing repeatition of background in my project ...:(

Member Avatar for hericles

Is that a copy and paste of the code in your site or did you type that in there? I ask because it is correct and should work. Either the code on your actual page has an error in it or something else is going on. Do you have an external style sheet as well? Or any <style></style> section in the page header? In your attempts to fix it you may have specified another rule elsewhere that is conflicting (possible but not very probable).

Member Avatar for sania khan

I apply background style but it gives me white background, and my background image "red-and-black-powerpoint-template.jpg" does not display as background.Here is my code

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Home.aspx.cs" Inherits="_Default" %>

<!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>Untitled Page</title>
    <style type="text/css">
        .style1
        {
            font-family: "Courier New", Courier, monospace;
            font-weight: bold;
            color: #FFFFFF;
            font-size: x-large;
        }
        .style3
        {
            font-family: "Courier New", Courier, monospace;
            font-size: xx-large;
            width: 1065px;
            height: 646px;
            color: #FFFFFF;
            font-weight: bold;
        }

    </style>
</head>
 <body style="background-image:images/red-and-black-powerpoint-template.jpg; background-repeat:no-repeat" >

    <form id="form1" runat="server" >

    <div style="height: 646px; width: 1065px; margin-right: 0px;" align="left">

    &nbsp;&nbsp;<asp:Label ID="Date" runat="server" 
            style="color: #FFFFFF; font-weight: 700; font-style: italic; font-family: 'Courier New', Courier, monospace"></asp:Label>

        <span class="style3">
        <br />
&nbsp;&nbsp;&nbsp; AUTOMATION AND CONTROL ENGINEERING GROUP PROJECT</span><br />

&nbsp;<br />
        <br />
        <br />
        <br />
        <br />
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <asp:Label ID="Label3" runat="server" 
            style="font-family: 'Courier New', Courier, monospace; font-weight: 700; color: #FFFFFF; font-size: x-large" 
            Text="EQUIPMENT PURCHASE"></asp:Label>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<asp:ImageButton ID="ImageButton1" runat="server" Height="78px" 
            ImageUrl="~/images/Keyboard icon.jpg" onclick="ImageButton1_Click" 
            Width="88px" />
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
        <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Report" 
            Width="168px" />
        <br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;
        <span class="style1">BOOK AND MAGAZINE</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <asp:ImageButton ID="ImageButton2" runat="server" Height="77px" 
            ImageUrl="~/images/Keyboard icon.jpg" Width="87px" 
            onclick="ImageButton2_Click" />
        <br />
        <br />
        <br />

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <br />
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <asp:Label ID="Label4" runat="server" 
            style="font-family: 'Courier New', Courier, monospace; font-weight: 700; color: #FFFFFF; font-size: x-large" 
            Text="EXIT"></asp:Label>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;
        <asp:ImageButton ID="ImageButton3" runat="server" Height="83px" 
            ImageUrl="~/images/Cute-Ball-Stop-icon.png" Width="87px" 
            onclick="ImageButton3_Click" />
        <br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <br />
        <br />
        <br />

    </div>
    </form>
</body>
</html>
Member Avatar for hericles

This is incorrect:

<body style="background-image:images/red-and-black-powerpoint-template.jpg; background-repeat:no-repeat" >

This,which you had in your previous post, is correct:

<body style="background-image:url('image.jpg'); background-repeat:no-repeat">

The correct syntax is background-image:url('location_of_image.jpg');
For consistency, seeing you have a style section, you should place all of your CSS there. Having some inline and some in the style section just makes it hard to find later.

Member Avatar for sheikhali449

It sometimes seems to be head cracking problems of images

Member Avatar for sania khan

Now backgroud is not repeating but now the new problem is that in the repeated portion our background is simple white.now we want to stretch our background.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.