HTML Background Image No-Repeat Without CSS
Last Updated : Mar 11, 2024
IN - HTML | Written & Updated By - Riya
In this tutorial we will show you the solution of HTML background image no-repeat without CSS, in HTML sometimes we want to set image as background. But due to some reason we are unable to set image as background accurately.
We have to face many problems that time. One of the problem is repeating of image again and again. So, today we are here to show you that how to set background image in html with no-repeat and without CSS.
We hope that you will understand the example properly, we define this in last points also.
Step By Step Guide On HTML Background Image No-Repeat Without CSS :-
Now, as there are many ways to set an image as background. But we will teach you the one in which the image should no-repeat and it covers full screen.
This can be done with or without CSS. The below example will show you that how you able to set background image in html with no-repeat, full screen.
<!DOCTYPE html> <html> <head> <title> Title of the document<title> </head> <body background-image="url(demo10/logo.jpg)" background-repeat="no-repeat" height="100%" width="100%"> </body> </html>
- First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
- Secondly, the <html> tag is used to indicate the beginning of an HTML document.
- As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
- Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here. Here, in this code, first condition is that we are not able to use CSS. We have to full code of this without CSS.
- Hence, to do this here we use only inbuilt tags that are of html. Here, first we create a body tag and no other tag is used. If you want to use any other tag, you can also use div here. And other task is performed with in this division.
- After this in body tag, we use some inbuilt properties of html. Which are like background image, background repeat, height and width. These are already described in our example, for reference you can go through this.
- The first property that is background-image is used to give url of image in body, the other background-repeat is used to not repeat images continuously, after this we use height and width with 100% value, so that it covers full screen or display or browser.
- At last, the <body> and <html> tags are closed with </body> and </html> respectively.
Conclusion :-
In conclusion, here we can say that you are now able to make or set an image in background with no-repeat. This all process is done with the help of html properties, there is already an article regarding, background image in html with no-repeat and full screen.
If you want to try, we also recommend you to go through it. I hope this tutorial on HTML background image no-repeat without CSS helps you.
About Riya
