HTML Tutorial
Working on Links and Images
| Anchored Links… |
| Without links, the World Wide Web wouldn’t be a web at all! To add a link… you will use the <a href="location"> opening tag and </a> closing tag. Whatever appears between these two tags will become underlined and colored, and if you click on the underlined text it will send the browser to the location within the quotes.
Example of a link…
Explore Nazcar Multimedia!!
Explore <a href="http://www.nazcarpine.com/">Nazcar Multimedia</a>!
If you are just linking to a page in the same directory as your current page, you don’t need the domain, just the page name. If you have a page called Gallery.html, you can use the code <a href="gallery.html">Contact Me</a>.
Note: Although links are usually used to send people to other web pages, you may also use links to send email to a specific address by using a location of mailto:user@host.
Example of a Mailto: Link…
Send email to Nazcar Pine
Send email to <a href="mailto:naz@nazcar.tk">Nazcar Pine </a>
If you want a link to open in a new window, add target="_blank" the end of the anchor tag, e.g. <a href="http://www.nazcarpine.tk/" target="_blank">NazcarPine.tk</a>.
Example of a link opening in a new window…
Visit Nazcar Multimedia Blog
|
|
| |
| In-line Images… |
| You may also add images (pictures) to your web page, as long as the image is in the .gif or .jpg (or .jpeg) file formats. You will not be able to use .bmp format files! The basic tag for in-line images in <img src="location">. It is also recommended to add HEIGHT and WIDTH attributes to the IMG tag, which will allow the image to take proper proportions on a browser that is not currently viewing images. It is also recommended to use the ALT="what picture is" to tell a person what a picture is in case it is still loading or they are not viewing images. (The IMG tag has no closing tag!) |
If your image is in the same directory as your HTML file, just use the image name. If your file is welcome.jpg, you can use <img src="welcome.jpg"> Then add the appropriate height, width, and alt attributes as mentioned above.
|
| |
| Combining Links and Images… |
|
|
Pages:
1 2 3 4 5 6
7 8 9 10 11 12 13 14
