html5 link to,HTML Links

HTML's element is used to create clickable links to locations either inside the same HTML page,

or an external page. When the link is clicked, the browser jumps to the new location. The elements

name is short for "anchor".

Basic Links

The basic structure of a link element looks like this:

Jakob Jenkov's tutorial website

Here is how the link looks in the browser:

As you can see, the text inside the element body is used as the clickable link text.

When the link is clicked the browser changes location to the URL listed inside the href

attribute value. In the example above, this URL is http://tutorials.jenkov.com .

Relative Link URL's

It is possible to use relative URL's in the href attribute. A relative URL is a URL

that is relative to the URL of the page that contains the link. For instance, the URL of this page

is:

http://tutorials.jenkov.com/html4/links.html

If you use the relative URL

lists.html

on this page, it will be interpreted as being located

within the same directory as the page containing the link. In other words, the browser will interpret

the URL as:

http://tutorials.jenkov.com/html4/lists.html

Similarly, the relative URL

elements/a-sub-element.html

will be interpreted as:

http://tutorials.jenkov.com/html4/elements/a-sub-element.html

You can use two dots (..) to mark that you need to go a directory up. From there, you

can also go a directory down again (or more) if you want to. Hence, the relative URL

../html5/index.html

listed on this page will be interpreted as:

http://tutorials.jenkov.com/html5/introduction.html

Notice how the link part html4 has been replaced with html5 because

of how the dots (..) in the relative URL is interpreted.

Parameters in links

You can add parameters to a link URL, by adding a question mark (?) at the end of the URL,

and add a parameter name, an equal sign and a parameter value. Here is an example:

?myParam=myValue

If you need to add more than one parameter, add an ampersand character (&) after each parameter

value, before the parameter name and value of the next parameter. Here is an example:

?myParam=myValue&param2=value2

Here is a full URL including parameters:

http://tutorials.jenkov.com/html4/links.html?myParam=myValue&param2=value2

Parameters can be used by the page that you link to, if the page is generated dynamically.

A static HTML page usually does not use parameters.

Fragments in Links

A link URL can contain a fragment. A fragment references a point inside the HTML page it links to.

To be able to reference a fragment, you must first insert an anchor in the HTML page to reference.

The anchor looks like this:

The value inside the name attribute should be unique within the HTML page that contains

the anchor. Otherwise the browser cannot know which of the anchors to jump to.

The anchor is referenced via the URL of a link, by adding #fragmentName (called a fragment)

at the end. For instance, if the URL of the page containing the anchor is

http://tutorials.jenkov.com/htm4/links.html

then you add the fragment name to the URL at the end, like this:

http://tutorials.jenkov.com/htm4/links.html#fragmentName

If you click a link with the URL above, the browser will jump to the page with the given URL,

and down into the HTML document to the anchor with the name fragmentName.

Link Target

By default the browser opens the page the link points to in the same browser window as

the page containing the link. If you want to open the page in a new window instead, you

can set the attribute target to the value _blank. Here is

an example:

Jakob Jenkov's tutorial website

Here is the link as it looks in the browser. If you click it, the page will open

in a new browser window.

Jakob Jenkov's tutorial website