base element

If you don't know what an element is or how you must use it, I recommend you read the "HTML tags and attributes" tutorial that you can find in the HTML tutorials section.

Description

The base element can provide a base URI to resolve all relative URIs in the document, or to define the default context in which all document's links will be open. In short, it sets default behaviors for links and URI resolving in an HTML document.

The base element can only be declared in the head of the document and only once and, because of its purpose, must precede all elements which need URI resolving or represent hiperlinks.

Examples

For the next example, we'll assume that we have a website dedicated to show images. In this case, it would make sense to define the base URI as the directory where the images are, in order to lighten the task of linking them.

Then, we'll create the page for the "flowers" category of that website, so the base URI is set to simplify all the images' URIs.

<head>
  <title>Images of flowers</title>
  <base href="http://www.images-website-example.com/images/nature/flowers/">
</head>
<body>
  <img src="lily.jpg">
  <img src="orchid.jpg">
  <img src="lotus.jpg">
</body>

Attributes

Specific attributes

href

The base URI from which all relative URIs in the document will be resolved.

Example

<head>
  <title>My blog</title>
  <base href="http://www.my-blog-example.com/">
</head>

target

A default context-browsing name or keyword that will establish how all links in the document must be open. This value can be a browsing-context name (like the value of the name attribute of an iframe) or any of the following values (case-insensitive):

  • _blank: links will open in a new window.
  • _parent: links will open in the immediate parent context.
  • _self: links will open in the same context that's containing the link.
  • _top: links will open in the topmost context (the greatest parent context containing the link).

The target attribute was deprecated in previous versions of HTML, but it's been reinstated in HTML5 as it becomes useful in combination with the iframe element.

Example

<head>
  <title>My website</title>
  <base target="_blank">
</head>

Global attributes

For information about global attributes refer to this list of global attributes in HTML5.

Events

Global events

For information about global events refer to this list of global events in HTML5.