background-image:no-repeat not working, syntax is correct

Question

Below is the syntax I am using for the background Image. For some reason it is repeating on Y . I cannot use overflow:hidden;

<style>
body{background-image:url('<?php echo $ActualPath; ?>images/backgroundimage.jpg'); background-image:no-repeat;}

</style>

I want the background-image no-repeat on x and y.

Answer 1

The syntax you should use is

background-image: url(path/images/backgroundimage.jpg);
background-repeat: no-repeat;

.. or alternatively

background: url(path/images/backgroundimage.jpg) no-repeat;

if you prefer the short-hand syntax .

background-image always just defines an image file, so in your example, the second background-image rule is attempting to override the first one, but since "no-repeat" isn't a valid image file the browser just ignores it.

The various background properties are listed here for reference.

Answer 2

The background property has a few properties you can change.

• background-color
• background-image
• background-repeat
• background-attachment
• background-position

You can set each one individually, like what you're trying to do. If you set the same one twice, only the last one will take effect.

You're setting background-image twice where the second one should be background-repeat .

There is also a shorthand notation where you do something like

background:#ffffff url('img_tree.png') no-repeat right top;

to set multiple properties in one line. You could use that to change your code to

body{ background: url('<?php echo $ActualPath; ?>images/backgroundimage.jpg') no-repeat; }

Answer 3

您可以使用background-repeat:no-repeat;

Answer 4

For getting no repeat of background in html use this syntax: CSS(Internal stylesheet) use this code in style tag in head part

background-image:url("some picture url");
background-repeat:no repeat;

-It will provide background image of single view without repeatation.