|
|
|
Basic HTML - Part 2 The webpage is starting to come together now but what is a webpage without a bit of colour and a few pictures.
Adding a background colour Inside the body tag (<body>) simply copy this code <body bgcolor='yellow'> That is all there is to it. Obviously, you can change yellow to whatever colour you like.
<body>
Adding a picture Before you can add any pictures you must first put the pictures somewhere so that you can make a reference to them. An easy way to understand this is to think of it as giving a friend directions to where you live.
For example: http://www.onlineauctionhelp.co.uk/ could be thought of as the town images could be thought of as the street newmembers.gif could be thought of as the door number It is important to make sure that the address is correct otherwise my friend would not be able to find me. The image below is stored under the address - http://www.onlineauctionhelp.co.uk/images/ The name of the picture is - newmembers.gif <img src= > in this space enter the address of where the picture is stored beginning http://
alt is simply some text to be displayed if the image can not be displayed . So, for example, the same picture above will now look like this:
And if the picture is not available you would see this
Linking a picture Click on the picture below
To get the link to open up in another browser you just need to state the target like below. <a target="_blank" href="http://www.onlineauctionhelp.co.uk"><IMG SRC=http://www.onlineauctionhelp.co.uk/images/newmembers.gif></a>
Adding a link to a different page
Links are what allow people to move to other pages on the Internet. They can
usually be identified because the mouse pointer changes when over a link and the
text is usually underlined and blue (although this is not always the case). To
create a link use the following: For example
An email link works in a similar way to a normal link. To create a simple email
link:
Practical Test 3 Again lets go back to the webpage we created earlier. Open up the test.html document in Notepad - right click on the test.html file and then choose "Open With" then "Notepad". Fist of all lets change the background colour. Copy and paste the code below into the test.html document - just below the <body> tag.
<body bgcolor='pink'> Next, I have a picture located here - http://www.onlineauctionhelp.co.uk/images/ The name of the picture is - picturetest.gif Using the example given above, add this picture to your webpage - any where between <body> and </body>. If you want to cheat you can scroll down to the bottom of this page where I shall give you the code. You shall get more satisfaction from working it out yourself though. And that concludes my introduction to basic HTML. I hope you didn't find it too taxing. I assure you that the more you use and play around with HTML the easier you shall find it.
Are you sure you want to cheat?
<img src="http://www.onlineauctionhelp.co.uk/images/picturetest.gif">
|
|
LEGAL INFO: eBay® is a registered trademark of
eBay®, Inc. eBay®, Inc. is not associated with
OnlineAuctionHelp
in any way, nor is OnlineAuctionHelp |