HTML5 <base> Tag

The HTML <base> tag is used to specify the base URL that should be used to resolve all relative URLs contained within a document. There can be only one <base> element in a document. This element also provides a document-wide default browsing context name for following hyperlinks.

No other content is permitted inside the <base> tag as it is a void element. The start tag is mandatory for this element but there must be no closing tag. The parent of the <base> tag can be any <head> element that doesn’t contain any other <base> elements.

When multiple <base> elements are specified, only the first href and first target value are used. All others are ignored.

Here is an example of using this tag:

<!DOCTYPE html>
<html>
  <head>
    <title>This is an example for the &lt;base&gt; element</title>
    <base href="http://tutorialio.com/">
  </head>
  <body>
    <p> Read more about <a href="html/base-tag.php">the HTML &lt;base&gt; tag</a> on Tutorialio.
    You can also directly go to <a href="html/">the HTML Reference</a>. </p>
  </body>
</html>

Attributes

href

This attribute is used to define the base URL to be used throughout the document for relative URL addresses. If this attribute is specified, this element must come before any other elements with attributes whose values are URLs. You can set this attribute to absolute and relative URLs.

target

This attribute determines the default location to display the result when hyperlinks or forms on a webpage cause navigation. This attribute is only applicable for elements which do not have an explicit target value specified. It can have any of the following values:

  • _self: This value tells the browser to load the result into the same browsing context as the current one. This value is the default if the attribute is not specified.
  • _blank: This value tells the browser to load the result into a new unnamed browsing context.
  • _parent: This value tells the browser to load the result into the parent browsing context of the current one. If there is no parent, this option behaves the same way as _self.
  • _top: This value tells the browser to load the result into the top-level browsing context. Top-level browsing context means context that is an ancestor of the current one, and has no parent). If there is no parent, this option behaves the same way as _self.

Examples

See the Pen HTML base Tag by Tutorialio (@tutorialio) on CodePen.

Further Reading

  1. Read more about the HTML <base> element on MDN.
  2. You can also read the HTML <base> tag reference on W3C.

Reader Comments

1. You can register or login to post a comment. Asking readers to register improves the quality of discussion.

2. As a registered user, you will also get to access features like choosing between a light and dark theme or anything else that we might implement in future.

Follow Us For Updates

FacebookTwitterGoogle+
Go To Top