I am a beginner in HTML and am taking a Multimedia class for school. I noticed for many websites such as ESPN, CNN, Google, etc. that there was no direct image source for the entire background. How might I be able to incorporate an image for an entire background of a website? Thanks I appreciate it!
OH ok I see the problem, I was in HTML, not CSS. So where do I find the source file? I know in HTML if there is a image placed it will usually be followed by something like img src etc., and the image I want to use I usually copy the image location and paste, is this the same for this? Also I see in the CSS script the words
body {
margin:0;
Something like that?
With CSS:
body
{
background-image:url('myImage.gif');
}
Your question is not so clear though...
If you are trying to add the background image into your HTML, I would add it to the body div:
<body background="blue.jpg">
If you want to add it to your CSS or stylesheet, use this:
body {background: url(blue.jpg); }
Does that answer your question?
Related
So I am really new at programming (literally started yesterday lmao). So I wrote the code and everything and the backround color just doesn't want to change to black. I also have an issue where my image is not showing up on my webiste (it used to but now its only an blank square).
Thanks for answers :)
Please check your CSS file, in CSS file yoou write background:red; so please change that with below code.
<style>
body
{
background-color:red;
}
</style>
For background, you need to write complete term background-color: red; to make it work.
For image, make sure that the image exists in the same directory as the HTML file as you are not giving any extra path in your code.
Also, I would suggest that you go through any beginner guide on youtube first so that most of your queries are answered.
For colouring background, you need to change this:
body { background-color: red; }
And for your image issue, make sure you are entering the right path of the image.
You can also refer here: https://www.w3schools.com/tags/tag_img.asp
I currently have this, but it is not setting the background as expected:
<body style: background-image url()>
Also I need it to be a file not a link
Looks like #Sverre beat me to the suggestion of moving your CSS style to a separate file. If you prefer to leave it directly in the tags, you will have to reformat it a bit like so:
<body style="background-image: url('https://yourdomain.com/some-image.png')">
I'd recommend doing this in your CSS file. This page goes in depth on CSS backgrounds and shows you how to style them as well.
You can do it in the body tag as follows:
body {
background-image: url("example.jpg");
}
I'd like to make an image the background of one of my html pages.
I tried
body
{
background-image:url('./images/backgroundimage.gif');
}
But this wouldn't make it appear as the background image. I feel like this should be working, but it isn't. Anyone have better ideas, or see what I have wrong with this idea?
Drop the single quotes and the ./
Also, make sure that file actually exists relative to the that css file's url.
Edit: also search.
Try using this background-image:url(../Images/backgroundimage.gif); and as bkconrd suggestion, make sure your image file located in correct path(I assume you ain't newbie in HTML, hope you check your directory structure). you can Use inline css too <body STYLE="background-image: url(../images/backgroundimage.gif)"></body>(for testing purpose, But usage of Inline Style generally not recommended style of coding).
Hope this helps you, If not let us know .... Happy coding
How about trying this. I think this will work because I have tested it.
body {
background:url('./images/backgroundimage.gif') no-repeat 0 0;
}
I am using the following code, but it is having no effect!! Can this be done?
html {
background: #d9dbdc url('images/repeat-x.png') repeat-x;
}
This will work if you actually have an image at the specified location, although it's usually applied to the body element. It could be that the body element has a background colour that is covering the image.
Note that paths are relative to the style sheet file, not the HTML file embedding it, so a path pointing to images/repeat-x.png in /css/styles.css would result in /css/images/repeat-x.png.
Yes, it can be done, but it needs to be on the <body> tag.
Your image might not exist, or you might have a different background covering it.
If you are trying to set the background of the entire page I'd recommend:
body {
background: #d9dbdc url('images/repeat-x.png') repeat-x;
}
make sure the url is correct, you can use browser debug tool like Firebug in firefox to inspect the html
Topic explains it all. I've got it set as...
body{
background-image:url('images/bg.gif');
background-repeat:repeat-x repeat-y;
}
Can't seem to figure out why it's not rendering in the background. I'm new to wordpress themeing in general. Could anyone help me out? I've posted a link to the content in full below.
http://www.aidanchurch.com/blog/
In the style sheet, I see some garbage characters right in front of the
body{ background-image:url('images/bg.gif');
line in the css file. Those might be making the rendering skip the rule. I'd backspace and clean that up.
It looks like you background image is located here:
http://www.aidanchurch.com/blog/wp-content/themes/bloo_06/images/bg.gif
So first of all try an absolute address like so:
background-image: url('/blog/wp-content/themes/bloo_06/images/bg.gif');
However if that works, you really want a relative URL, so take a look at the directory structure of your theme and ensure the background image is indeed relative to the css file you have written that rule in, in the way you have written.
Check that you have uploaded the correct image to the correct place. When I tried to view the image I could see a very small and transparant image. http://www.aidanchurch.com/blog/wp-content/themes/bloo_06/images/bg.gif .