Links and Images


| Basics | Font Effects | Links/Images | Table |


«Links: General»
A link is generally a word or phrase that transports the user to a different URL or website. So, how exactly do you create one of these? The answer is actually quite simple; the code below will create a basic link:

The result should look something like this: http://YOURURL. (Of course, the link will be replaced with whatever URL you choose)


On the other hand, if you wanted to transform a certain word into a link, rather than showing the URL alone, you could use this code:

The result should resemble this: YOUR TEXT.


Now, we can apply what we've learned in the previous tutorial to this one, and create links with different colors, fonts, and sizes:

Examples:
Click here!
No, click here!
Click here instead!
By combining those tags, we can thus create links of all colors and sizes. Take care to make sure, however, that the URL you are using is spelled correctly and such - otherwise, the link will most likely lead to a broken page.


«Images»
Images are an essential part of every website, and fortunately, they are quite easy to display with HTML, as long as you have the URL of the image you plan to use. Take note, however, that you cannot use the directory your computer uses for the URL for images on your computer - you need to upload your image onto an image host such as Photobucket or 1ASPHost first. You should also try to avoid using a URL or an image on the Internet that isn't uploaded onto your own host - this is called "hotlinking," and some site owners frown upon it, as it uses up the bandwidth of their host - try not to do this unless you are fairly certain that the website has no problem with you hotlinking their images.

The above code will display an image on your website such as the following one:

Simply replace the URL with the URL of your image.


You can use the alt tag on images as well, which will display a small message as you hover your mouse pointer over the image; simply use the following code...

... for an effect such as this:
Neo Nutters - Visit today!


If you would like to make an image itself link to another URL, simply combine the link and image codes:

Example:
Neo Nutters - Visit today!


To get rid of the little border around your linked images, simply add border="0" to the code, like such:

Example:
Neo Nutters - Visit today!



Report an error Report an error Change your site settings Change your site settings
© Neo Nutters of Neopia