How To Put A Background Picture On A Web Page
RegisterLogin
How To Put A Background Picture On A Web Page
Post Description: How To Put A Background Picture On A Web Page
Tags: How, To, Put, A, Background, Picture, On, A, Web, Page
This Post Was Posted On Oct 01, 2009 By Webune #2468
Post Description: How To Put A Background Picture On A Web Page
Tags: How, To, Put, A, Background, Picture, On, A, Web, Page
This Post Was Posted On Oct 01, 2009 By Webune #2468
How To Put A Background Picture On A Web Page by Webune
well, the answer is simple. here at Webune, we provide helpful assistance to all levels of professional and beginners. if you are a profesional web developer or a novice web designer, we have the right web hosting solutions for you.
ok, so you want to know how you can put a pic as the background on a web site.
1. step one is to open your favorite text editor. if you are using windows XP lets say, you can use notepad. i will be using notepad, so open a blank notepad.
2. now that you have a blank notepad, we are going to put the basic tags for a HTML page. so copy and paste this code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Webune Background Tutorial</title>
</head>
<body>
<div align="center">
<h1>Page With Background Tutorial </h1></div>
<p>Hi, as you can see, this tutorial has a cool background!</p>
<p>For more tutorials, visit us at: <a href="http://www.webune.com">www.webune.com</a></p>
<div align="center">
<h1>by <a href="http://www.webune.com">Webune.com</a></h1>
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Webune Background Tutorial</title>
</head>
<body>
<div align="center">
<h1>Page With Background Tutorial </h1></div>
<p>Hi, as you can see, this tutorial has a cool background!</p>
<p>For more tutorials, visit us at: <a href="http://www.webune.com">www.webune.com</a></p>
<div align="center">
<h1>by <a href="http://www.webune.com">Webune.com</a></h1>
</div>
</body>
</html>
3. ok, in notepad save the file as "webune2468" in your desktop, IMPORTANT: be sure to put the quotes. so to save it, go to File > Save As.. [look at the image below in the arrow]
4. now open the file using internet explorer, right click and select: Open With.. and choose internet explorer
5. it will look something like this:
6. now comes the fun part. lets say i want to put a background picture so for this tutorial, lets say i want to put this picture as the background:
7. so open webune2468.html with notepad and look for the line where it says <body>
we are going to add some style, so ad this:
style="background-image:url(http://www.webune.com/forums/web/img/webune-com/200910/01p-2468-texture-bg.gif)"
so it should look like this:
<body style="background-image:url(http://www.webune.com/forums/web/img/webune-com/200910/01p-2468-texture-bg.gif)">
now save the changes and open webune2468.html with your internet explorer, you will see that the image is now the whole background for the page
ok, here is the final code, if you want to copy and paste it to notepad and save it as an html file:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Webune Background Tutorial</title>
</head>
<body style="background-image:url(http://www.webune.com/forums/web/img/webune-com/200910/01p-2468-texture-bg.gif)">
<div align="center">
<h1>Page With Background Tutorial </h1></div>
<p>Hi, as you can see, this tutorial has a cool background!</p>
<p>For more tutorials, visit us at: <a href="http://www.webune.com">www.webune.com</a></p>
<div align="center">
<h1>by <a href="http://www.webune.com">Webune.com</a></h1>
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Webune Background Tutorial</title>
</head>
<body style="background-image:url(http://www.webune.com/forums/web/img/webune-com/200910/01p-2468-texture-bg.gif)">
<div align="center">
<h1>Page With Background Tutorial </h1></div>
<p>Hi, as you can see, this tutorial has a cool background!</p>
<p>For more tutorials, visit us at: <a href="http://www.webune.com">www.webune.com</a></p>
<div align="center">
<h1>by <a href="http://www.webune.com">Webune.com</a></h1>
</div>
</body>
</html>
Leave Your Comments
Related Pages: [Add Your Website]
Post New Topic
©2012 Webune Forums - Thu Dec 13, 2012 11:11 pm
Powered by: Webune Forums V3
Powered by: Webune Forums V3