It is used to specify the base URL used in all relative URLs of a document and/or the default target attribute. It must therefore have at least one href
or target
attribute defined, being able to have both.
There can only be one <base>
element per document and it has to be inside the <head>
. If there is more than one, only the first href
and target
will be taken into account, the rest will be ignored.
If either of these two attributes is defined, the <base>
element must appear before other elements with attribute values that contain URLs, such as a <link href = "">
.
It has two attributes:
-
href
: the base URL that will be used throughout the entire document in relative URLs. It can take the value of an absolute or relative URL. -
target
: a keyword that defines the navigation context in which to display the navigation results of<a>
,<area>
and<form>
elements that do not have atarget
attribute explicitly defined. It can have the following values:-
_self
: shows the result in the same navigation context. It is the default value. -
_blank
: displays the result in a new, unnamed navigation context. -
_parent
: shows the result in the navigation context of the parent of the current one if the current page is within a frame. If there is no parent, it acts the same as_self
. -
_top
: shows the resource in the highest navigation context that is an ancestor of the current one. If there is no parent, it acts the same as_self
.
-
Internal links to a document fragment, for example <a href="#id-example">
are resolved using <base>
, triggering an HTTP request to the base URL with the fragment appended. For instance:
- Given
<base href = "https://example.com">
- ...and this link:
<a href="#anchor">Anchor</a>
- ...the link points to
https://example.com/#anchor
Open Graph tags don't recognize the <base>
element, so they should always have absolute URLs. For instance:
<meta property="og:image" content="https://example.com/thumbnail.jpg">
- Type: -
- Self-closing: Yes
- Semantic value: No
Top comments (0)