The Base Element

The <base> element specifies the base URL and/or default target for all relative URLs in a document. It must be placed inside <head>, and there can only be one <base> element per page. Both the href and target attributes are optional, but at least one must be present.

When and How to Use It

Setting <base href="https://example.com/docs/"> means every relative link like <a href="intro.html"> resolves to https://example.com/docs/intro.html. This is useful for documentation generators or pages served from deeply nested paths that reference resources by short relative paths. The target attribute sets the default target for all links on the page — for instance, target="_blank" would open all links in new tabs unless overridden per link.

Example

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Base Element Demo</title>

  <!--
    All relative URLs on this page now resolve
    relative to https://example.com/docs/v2/
  -->
  <base href="https://example.com/docs/v2/">
</head>
<body>
  <h1>Documentation</h1>

  <!-- Resolves to: https://example.com/docs/v2/intro.html -->
  <a href="intro.html">Introduction</a>

  <!-- Resolves to: https://example.com/docs/v2/img/logo.png -->
  <img src="img/logo.png" alt="Logo">

  <!-- Absolute URLs are NOT affected by <base> -->
  <a href="https://other-site.com">Other Site</a>

  <!-- Override target for a single link -->
  <a href="notes.html" target="_self">Notes (same tab)</a>
</body>
</html>

HTML

Full Editor

Pro Tip

Use the <base> element with caution — fragment links like href="#section" will resolve relative to the base URL, not the current page, which can break in-page anchor navigation in unexpected ways.

Related Resources

HTML Reference

Complete tag & property list

HTML How-To Guides

Step-by-step practical guides

HTML Exercises

Practice what you've learned