|
In this chapter you have learned how to create hyperlinks to weave your Web site into a cohesive whole. You have also learned how to link to specific locations on a different page as well as linking to other Web sites. This quick reference section will remind you of what you have learned as you begin to create and link together the pages of your own Web site.
Hyperlinks are what make the Web a web. You can create links from text, photos, clip art, and so on, by enclosing them inside the anchor element. You also can link to a particular spot on the same page and even a certain spot on a different page. The elements and attributes in the next table will help you remember how to create and style your own links.
To Do This | Use This |
---|---|
Create a hyperlink | <a href=" "> </a> |
Link to a different page | <a href="webpage.htm">Link</a> |
Set a place marker that you can link to (used for linking to a specific spot on the same page or on another page) | <element > </element> |
Create a named anchor using the name attribute (deprecated) | <a name="spot"> </a> |
Link to a place marker or named anchor on the same page | <a href="#spot">Link</a> |
Link to a place marker or named anchor on | <a href="Webpage.htm#spot">Link</a> |
Link to a place marker or named anchor on | <a href="http://www.newSite.com/ |
Open a link in a new window | <a href="webpage.htm" target="_blank">Link</a> |
Create an e-mail link | <a href="mailto:email@server.com">Link</a> |
Cause links on a page to change to red when | <style> a:hover {color: red} </style> |
Remove link underlines | <a href="webpage.htm" style="text-decoration: |
If you had problems getting your Project 7 page to match up with the picture in Figure 5-1, the HTML markup for creating that page is provided here. Compare your code to that which follows, and try to find the solution to your problem. If you’re really adventuresome, try modifying this code by creating some place marker links to other pages or changing the color or appearance of your links:
<html> <head> <title>My HTML Reference Guide</title> </head> <body> <h1>Pages I've Created</h1> <ul> <li><a href="headings.htm">Headings</a></li> <li><a href="text.htm">Text Elements</a></li> <li><a href="sup.htm">Superscript & Subscript</a></li> <li><a href="del.htm">Deleted Text</a></li> <li><a href="pre.htm">Preformatted Text</a></li> <li><a href="ulist.htm">Unordered List</a></li> <li><a href="ulist2.htm">Multi-level Unordered List</a></li> <li><a href="olist.htm">Ordered List</a></li> <li><a href="olist2.htm">Ordered List with Start Attribute</a></li> <li><a href="olist3.htm">Outline List</a></li> <li><a href="dlist.htm">Definition List</a></li> <li><a href="text-format.htm">Text Formatting</a></li> <li><a href="generic-fonts.htm">Generic Fonts</a></li> <li><a href="font-colors.htm">The Color Property</a></li> <li><a href="16colors.htm">The Sixteen Basic Colors</a></li> <li><a href="css-color.htm">CSS Color</a></li> </ul> <a href="index.htm">Home</a> </body> </html>
|