HTML base Tag
HTML <base> tag is used to represent a base URL for all the URLs in the HTML document. For example, if we have multiple URLs for the same domain name on a single webpage, then we can specify the base URL using the <base> tag in the HTML document head, and then just add the relative paths in the HTML document body. The base URL will be automatically added to all the relative URLs present on the webpage.
-
We can only have a single base URL and should not have more than one base URL.
-
Therefore HTML any document can only have a single <base> tag and it must be placed inside the <head> tag(HTML <head> tag!) only.
-
This Base URL will be the base of every URL on the webpage on which we use the <base> tag and it must be a prefix of all the URLs on that specific page. Hence, we should be careful if we have to include URLs of different websites on the same page.
HTML <base> Tag - Syntax and Usage
The <base> tag is an empty tag, or an open tag which means it does not require any end or closing tag.
Following is the syntax for using the <base> tag:
<!-- declaring the base URL -->
<base href="BASE_URL" />
As you can see in the syntax above, just like the HTML anchor tag, the <base> tag also uses a href attribute to specify the URL.
HTML <base> Tag Attributes
HTML <base> tag supports Global attributes and Event attributes and some specific attributes which are given below:
| Attributes |
Description |
href |
The base URL to be used throughout the document is specified using href attribute. |
target |
This attribute is used to specify where to open the hyperlinked URL, in the same browser tab, in a new tab, etc. |
HTML <base> Tag Example
Below we have a basic example of <base> tag, where we have used it to specify the base URL for all anchor tags.
In the example above, we have 4 anchor tags, the first 3 will get the base URL added to them, but if we have to include some other URL on the webpage, in that case we can provide the complete URL starting with http:// or https://, then the base URL will not be added to this URL.
Also, we have used the target attribute with _blank value, which gets applied to all the hyperlinks on that webpage by default. Other values that can be used for the target attribute are _self, _parent, _top, etc.
We have used only one <base> tag in our HTML document, in the example above, try adding one more (the first one will be considered).
And it's recommended that the <base> tag should be used inside <head> tag, although if you add it in the <body> tag, it will still work.
Browser Support for HTML <base> tag
Following browsers support this attribute:
-
Firefox 1+
-
Google Chrome 1+
-
Internet Explorer 2+
-
Apple Safari 1+
-
Opera 4+
