Background- image: By default, the image is applicable to entire page.
url():
- functions is used to specify the location of image
- If the image and our HTML file are in the same location – no need to specify the entire path of image.
- url(“abc.jpg”)
- If the image and HTML file are in different locations – we need to specify the complete path of image
- url(“d:/src/myimages/abc/jpg”);
| <!doctype html> <html> <head> <style> h1, h2, p{ color : red ; text-align : center ; } body{ background-image : url(“download.jpg”) ; } </style> </head> <body> <h1> Heading1 </h1> <p> Paragraph1 </p> <h2> Heading4 </h2> </body> </html> |
Background-repeat:
- We can set the direction of image only to
- X – Axis (background-repeat : repeat-x)
- Y – Axis (background-repeat : repeat-y)
- No repeat (background-repeat : no-repeat)
| <!doctype html> <html> <head> <style> h1, h2, p{ color : red ; text-align : center ; } body{ background-image : url(“download.jpg”) ; background-repeat : repeat-x; } </style> </head> <body> <h1> Heading1 </h1> <p> Paragraph1 </p> <h2> Heading4 </h2> </body> </html> |