-1

So i have a website i'am developing and i need to have an image as a background inside of a <div> tag in html, here is the current code i have so far:

<div id="menu" style="background-color:ffd700;float:left;height:600px;width:250;">

Weirdest
  • 67
  • 1
  • 1
  • 8
  • 1
    possible duplicate of [Background Image of a
    element](http://stackoverflow.com/questions/5604859/background-image-of-a-div-element)
    – Varun Feb 08 '14 at 02:37
  • Possible duplicate of http://stackoverflow.com/questions/851724/css-background-image-what-is-the-correct-usage – helion3 Feb 08 '14 at 02:37
  • Thank you for pointing out that question but it was not what i was looking for – Weirdest Feb 08 '14 at 02:57

2 Answers2

1
<div id="menu" style="background: #FFD700 url('myImage.jpg');">

The hex color value will be used if the browser the viewer is using an image blocker, unable to view the image, or if the image does not exist. The URL is the path to the image (can either be a relative or absolute path.

More info: CSS Basics: Background Properties

P.S. Even though this code block DOES in fact work, it is poor practice to set inline styles. You should always use an external stylesheet to separate your style from your content.

Mike Koch
  • 1,540
  • 2
  • 17
  • 23
1

First of all, it's not very good practice to use inline styles. Since your div tag already has an id, you can apply styles to that id within a stylesheet. The code to do so would look like this:

#menu {
    background: url("path_to_your_image") #ffd700;
    float: left;
    height: 600px;
    width: 250px;
}

The part that sets the background image is background: url("path_to_your_image") the #ffd700 applies the color. However, since the background image is set to repeat by default, you won't see the color unless you specify that the background should not repeat. You can do that by changing the above line to background: url("path_to_your_image") no-repeat #ffd700.

Of course, if you don't want to use a stylesheet, the same thing applies. You just have to put that line in the style attribute of your HTML tag.

Rhitakorrr
  • 104
  • 4