Документация
HTML CSS PHP PERL другое
Linking to Another Web Page
 
Previous Page
Table of Contents
Next Page

Linking to Another Web Page

The tag to create a link is called <a>, which stands for "anchor." While the word "anchor" might seem a little obscure when describing links, it has to do with the fact that you can use the <a>"anchor" so just go with it! Within the <a> tag, you put the address of the page to link to in quotes after HRef=, like the following:

<a href="http://www.stalefishlabs.com/products.html">click here!</a>

This link displays the words click here! in blue with an underline. When a user clicks those words, she sees the web page named products.html, which is located on the web server computer whose address is www.stalefishlabs.comjust as if she had typed the address into the web browser by hand. (By the way, Internet addresses are also called Uniform Resource Locators, or URLs, by techie types.)

Getting back to the <a> tag, HRef stands for "hypertext reference" and is an attribute of the <a> tag. You'll learn more about attributes in Hour 5, "Basic Text Alignment and Formatting."

An attribute is an extra piece of information associated with a tag that provides further details about the tag. For example, the href attribute of the <a> tag identifies the address of the page to which you are linking.

By the Way

<a href> link on a web page.


Did you Know?

example, you can use http://www.stalefishlabs.com to refer to the page located at http://www.stalefishlabs.com/index.html because the server computer knows that index.html is the page you should see first (see Hour 4, "Publishing Your HTML Pages"). Of course, this works only if a main index page existsotherwise, you should spell out the full web page name.


Listing 3.1 includes a few <a> tags, which show up as underlined links in Figure 3.1. The addresses for the links are given in the HRef attributes. For example, clicking the words Times Square in Figure 3.1 will take you to the page located at http://www.earthcam.com/usa/newyork/timessquare/ as shown in Figure 3.2.

Listing 3.1. <a> Tags Can Connect Your Pages to Interesting Locations
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  <head>
    <title>You Aren't There</title>
  </head>

  <body>
    <h1>Wonders of the World</h1>
    <p>
      Vacations aren't cheap. But who needs them anymore, with so many live
      cameras connected to the World Wide Web? Pack a picnic, and you can
      visit just about any attraction you want without ever spending any gas
      money or boarding a plane. Stop off at
      <a href="http://www.earthcam.com/usa/newyork/timessquare/">Times
      Square</a> in New York City to see a live view of the busy spot. Then
      head south to Atlanta, Georgia and watch the
      <a href="http://www.atlantafalcons.com/fans/article.jsp?id=6947">Atlanta
      Falcons training camp</a> live online. When you're finished watching
      Michael Vick, head out west to one of my favorite destinations and take
      in the incredible red rocks of
      <a href="http://www.earthcam.com/cams/arizona/sedona/">Sedona,
      Arizona</a>.
    </p>
  </body>
</html>

Figure 3.1. The HTML in Listing 3.1 produces this page, with links appearing as blue or purple underlined text.


Figure 3.2. Clicking the Times Square link in Figure 3.1 retrieves the live Times Square Earth Cams page from the Internet.


Did you Know?

or Edit Favorites box in your web browser, and select Edit, Copy (or press Ctrl+C or Command+C on the Mac). Then type <a href=" and select Edit, Paste (Ctrl+V or Command+V) in your HTML (text) editor.



Previous Page
Table of Contents
Next Page

 Приглашаем посетить сайты 
Мода Чехов Крылов Автомобили Хлебников Ходасевич Лесков Салтыков-Щедрин Шмелев CSS