Member Avatar for peace_coder

Hi, I am trying to add backgroung-image to body of a webpage. Its working on inline way but noy through css. I tried everything even searched on google. But I don't want where I am making mistake.

<!doctype HTML>
<html>
<head>
<title>Buttons</title>
<link rel = "stylesheet" type = "text/css" href = "assets/stylesheet.css" />
</head>

<body>

</body>
</html>

And here is CSS:

body {
    background-image: url("images/p3.jpg");
}

I also tried:

    body {
        background: url(images/p3.jpg);
    }

But not working!

  • 3 Contributors
  • 4 Replies
  • 368 Views
  • 17 Hours Discussion Span
  • Latest Post Latest Post by gentlemedia

Dani AI

Generated

A single, simple cause explains this thread: URLs inside a CSS file are resolved relative to the stylesheet’s location — not the HTML page. ’s path adjustment and ’s “check the console” advice correctly diagnosed the issue, and ’s follow-up shows it was a path-resolution problem rather than a CSS syntax bug.

Quick diagnostic checklist (practical steps used by front‑end devs):

  • Confirm the CSS file actually loads (Network tab → stylesheet should return 200). If the stylesheet is missing, any rules inside it won’t apply.
  • Look for the image request in Network (filter by “img” or search the filename). A 404 reveals the exact URL the browser tried to fetch — use that to compute the correct relative path.
  • Inspect the element’s computed style (Elements panel) to see which rule set the background and the resolved URL. That pinpoints whether the rule is applied and from which file.
  • Watch for case sensitivity, typos, spaces in filenames, and caching (hard reload / clear cache). On Linux servers file names are case‑sensitive; local Windows tests may hide that mismatch.

A compact, modern pattern to apply once the path is correct:

body {
  background: url('/path/to/example.jpg') no-repeat center center;
  background-size: cover;
}

Use an absolute path if the image lives at a known site root, or a carefully computed relative path when the stylesheet is in a subfolder. If builds/bundlers are used, check how they rewrite asset URLs.

Final notes: if problems persist, serve files from a simple local HTTP server (avoid file://), re-check any <base> tag or build step that alters paths, and inspect the Network tab for status codes — those give the clearest clue.

Recommended Answers

All 4 Replies

Member Avatar for gentlemedia

I asume your CSS is in that stylesheet.css, so then your path to that image should be like this.

body {
    background-image: url("../images/p3.jpg");
}
Member Avatar for Member #120589

Quick check in your console. If styleheet can't be found this will be stated in the console.

Member Avatar for peace_coder

This code is working!

    body {
        background-image: url("../images/p3.jpg");
    }

What was the problem on that codes which I sent? Can you tell me .

Edited by peace_coder
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.