CodesJava

Easy learning with example program codes

Base HTML

HTML <base> Tag

To specify a base URL or to specify a URL for all relative links within an HTML document, the HTML <base> tag is used. Within a document, only one <base> element can be specified and is placed within the <head> element. The HTML <base> element does not contain closing tag but the XHTML <base> element does require the closing tag </base>. The HTML <base> tag must have either an “href” attribute specified with it or a “target” attribute specified with it. The “href” and the “target” attribute can also be specified together with the HTML <base> tag.

Syntax:

<base href="https://www.example.com">

Example 1:

<!DOCTYPE html>
<html>
<head>
<base href="https://www.w3spoint.com/">
</head>
<body>
<p><img src="wp-content/uploads/2018/08/Bootstrap%204.JPG" width="300" height="200" alt="Bootstrap"></p>
<p><a href="https://www.w3spoint.com">W3spoint</a></p>
</body>
</html>

Output:

Explanation:

In the above example, the relative address for the image is specified. The browser will look for the image at the “https://www.codesjava.com/wp-content/uploads/2018/08/Bootstrap%204.JPG”, since the base URL is specified in the head section. The link specified within the <a> tag opens in the same window because neither the link has the target=”_blank” attribute nor the target attribute of the base element is present.

Example 2: Using _blank in <base> tag.

<!DOCTYPE html>
<html>
<head>
<base href="https://www.w3spoint.com/" target="_blank">
</head>
<body>
<p><img src="wp-content/uploads/2018/08/Bootstrap%204.JPG" width="300" height="200" alt="Bootstrap"></p>
<p><a href="https://www.w3spoint.com">W3spoint</a></p>
</body>
</html>

Output:

Explanation:

In the above example, the relative address for the image is specified. The browser will look for the image at the “https://www.codesjava.com/wp-content/uploads/2018/08/Bootstrap%204.JPG”, since the base URL is specified in the head section. The link specified within the <a> tag opens in the next window, since the target attribute of the base element is present and is set to “_blank”. The link itself has however no target=”_blank” attribute.

Tag Specific attributes:

AttributeValueUses
hrefURLTo define the base URL for all relative links.
target_blankTo open the relative link in the next window.
target_selfTo open the relative link in the current window.
target_parentTo open the relative link in the parent frame.
target_topTo open the links in full width of the page.

Global Attributes:

The HTML Global attributes are supported by the HTML <base> tag.

Event Attributes:

The HTML Event attributes are supported by the HTML <base> tag.

Supporting Browsers:

Chrome, IE, Firefox, Opera and Safari.

Please follow and like us:
error
Posted in HTML   









Copyright © 2019 CodesJava DMCA.com Protection Status