This article is Almost Ready.
The base element is used to specify a document's base URL and base target that is used for resolving relative URLs within the document.
|Permitted parents||Only permitted to occur once within
location object) is used as the base URL for resolving relative URLs. The
<base> element allows you to override this default with the
<a>) and forms (
<form>) open in a (
target). The default target is _self, resulting in the link opening in the same window as the document currently viewed. This default can be overridden document-wide using
If a document is integrated in an
iframe, it may help to specify
<base target="_parent"> in order to open the links within the iframe in the scope parent document. If _parent or _top are used without the document really being integrated in an hierarchy, expect the behavior of _self.
The example shows a link with the relative destination some-file.html that gets rewritten to http://example.org/deep/some-file.html
<!DOCTYPE html> <html> <head> <title>base element example</title> <base href="http://www.example.org/deep/"> </head> <body> <p>A <a href="some-file.html">relative link</a>.</p> <!-- after resolving the above link equals to --> <p>A <a href="http://www.example.org/deep/some-file.html">relative link</a>.</p> </body> </html>
The example shows that base only affects elements following it
<head> <title>base element example</title> <link href="my-style.css" rel="stylesheet"> <base href="http://example.com"> <link href="my-other-style.css" rel="stylesheet"> <!-- resolves to [current domain and directory]/my-style.css http://example.com/my-other-style.css --> </head>
The example shows how multiple base occurrences are collapsed and ignored
<head> <title>base element example</title> <base href="http://example.com"> <base target="_blank"> <base href="http://webplatform.org" target="_top"> <!-- equals to the single definition: <base href="http://example.com/" target="_blank"> except for Internet Explorer, where only the first element is read: <base href="http://example.com/" target="_self"> --> </head>
- Relative URLs within
<base>don't work in every browser, resolving a relative base URL was introduced in Firefox 4 and Internet Explorer 10.
<base>only affects elements following it's declaration.
<base>declarations are illegal, only the first
targetare used, the rest is discarded. Internet Explorer ignores all
<base>instances after the first.
Note Inline SVGs using references like
fill="url(#element-id)" can be a problem in documents using
<base>. The reason is that
url(#element-id) is actually a URL, not a CSS selector. At least Firefox and Chrome are susceptible to this behavior.
|HTML 4.01 Specification||W3C Recommendation|
|HTML5||W3C Working Draft|