How to Create a Web Page with Google Page Creator
How to Create HTML Lists in Notepad
How to Change an Article Title in Joomla CMS

How to Define Links in HTML Web Page Content

Links, those clickable objects that make the web what it is, are defined with the HTML <a> element. We complete our survey of the most essential HTML tags with an examination of this vital link in web page design.

The most essential attribute of any <a> element is the href attribute, which defines the link's destination. But <a> elements also must include some content — for example, some text — that displays in a browser and enables the link to work. For example, the following HTML code displays Search Google and links to

<a href="">Search Google</a>

Note that the entire link, including the display text, is enclosed within <a> and </a> tags. However, there is also a closing > after the actual link and before the displayed text.

Links can have defined targets, like the "blank" parameter used to open a link in a new browser window. To edit the preceding example to open in a new browser window, you would use this code:

<a href="" target="_blank">Search Google</a>

Absolute and relative links

Links can be absolute or relative:

  • Absolute links, like the one in the preceding examples, are defined with http:// at the beginning and include the entire URL for the link.

  • Relative links are used within a website. So, for example, if you were linking to a page called about_us.html, you could use

    Visit my <a href="about_us.html">About Us </a>page!

    However, the preceding code would work only if the about_us.html page is in the same folder as the page from which it was linked.

You can also define more complex relative links, using / to chart a path to the folder with the link. For example, to link to a file called slideshow.html in a subfolder (relative to the original page) named presentations, you would use this code:

Visit my <a href="presentations/slideshow.html">Slideshow</a> page!

How links look

When you build a style sheet for your site, you define how links appear in different states: unvisited, visited, active (in the process of being opened), or hovered (hovered over by a mouse cursor). By default, until you create a style sheet, links appear like this in all browsers:

  • Unvisited links are underlined and blue.

  • Visited links are underlined and purple.

  • Active links are underlined and red.

    There is no default hover state. And until you create one in a style sheet, hovered links do not change appearance.

blog comments powered by Disqus
How to Publish an Uncategorized Article in Joomla CMS
Using Notepad to Format Your Web Page
How to Use the CoffeeCup HTML Editor
How to Register for a Google Account
How to Create an Uncategorized Article in Joomla