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.
Table of contents
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.
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.