New course! Every coder should learn Generative AI!
Try a free lesson+ 9
How to add background image on article
I want to use an image as a background to the body of my html page
10 Answers
+ 19
HTML way:
<body background="image.jpg">
CSS way:
body {
background-image:url("image.jpg");
}
js way:
<script type="text/javascript">
$(document).ready( function() {
$('body').css('background-image', image.jpg)');
});
</script>
+ 5
CSS:
body {
background: url(http://example.com/background.png) no-repeat center center fixed;
}
background.png is the image file for the background
+ 3
how about just adding href attribute in there
+ 3
<style>
.art{
background-image: url("frog.jpg");
}
</style>
</head>
<body>
<div class="art"></div>
+ 2
Body {
Background-image: url();
Background-size: 0px;
}
+ 1
Edited. But you should download the image and upload it to your server. Provides faster loading.
+ 1
in most cases article is inside a section but let's suppose you have only one article in your html file,though, open up your css file and type this in:
article {
background-image: url (../image/image.png/) no-repeat (center,left,right ) for x and (top,center,bottom) for you
}//remind yourself about the image sizes which can also be controlled by background-size in case of using sign graphics. other than this go to csstricks.com
0
not working. trying to use an image from online link
0
I m with Manish
0
Background can be included in html by various ways-
1. By html
<body background="image.jpg">
</body>
2. By css
a) Using external css
CSS:
.body { background-image: url (image.jpg);
}
/* save css file
In my case, i saved it as test.css */
HTML:
<head>
<link rel="stylesheet" type="text/css"
href=test.css">
b) Using internal css
<style>
#body { background-image: url (image.jpg);
}
</style>
c) Using in-line css
<body style="background-image: url (image.jpg)">
Often have questions like this?
Learn more efficiently, for free:
