<a> - HTML CSS HTML Tag

HTML CSS examples for HTML Tag:a

  1. HOME
  2. HTML CSS
  3. HTML Tag
  4. a

Introduction

<a> element is to create Hyperlinks.

Hyperlinks can navigate through content, both within the same document and across pages.

The a Element summary

Item Value
Element a
Local Attributes href, hreflang, media, rel, target, type
Tag StyleStart and end tag required
New in HTML5 No
Changes in HTML5 The media attribute has been added. The id, coords, shape, urn, charset, methods, and rev attributes are obsolete.

Style Convention 

a:link,
a:visited {
   color: blue;
   text-decoration: underline;
   cursor: auto;
}

a:link:active,
a:visited:active {
   color: blue;
}

The a element defines six local attributes, described in the following table.

Attribute Description
hrefset the URL of the resource that the a element refers to.
hreflangset the language of the linked resource.
media set the device that the linked content is intended for.
rel set the kind of relationship between the document and the linked resource.
target set the browsing context in which the linked resource should be opened.
typeset the MIME type of the linked resource, such as text/html.

Using the a Element to Link to an External Resource

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
   <head></head>
   <body>
       I like <!-- ww  w  . ja  v a 2  s . c o  m-->
      <a href="http://java2s.com/">CSS</a>
       and 
      <a href="http://java2s.com/">HTML</a>
      .  
   </body>
</html>

Creating Relative URLs

If the href doesn't start with a recognized protocol, such as http://, the browser treats the hyperlink as a relative reference.

The browser assumes that a target resource is available in the same location as the current document.

Using a Relative URL in a Hyperlink

Demo Code

ResultView the demo in separate window 

<!DOCTYPE HTML>
<html>
    <body>
        I like <a href="http://java2s.com/">CSS</a> and <a href="http://java2s.com/">HTML</a>.
        I like <a href="app.html">this one</a>.
    </body>
</html><!--from   w  ww .j  a  v a 2s  . c o m-->

Related Tutorials