You might see <base> Element reference while reading someone else’s HTML, or need it while building a page of your own. Instead of memorizing a definition, look at a working example and see when the element makes sense.
The Idea in Plain English
Sets the base URL used to resolve relative links across the document. It can unexpectedly affect fragment links and other URLs.
For a reference page, pay attention to where the element is allowed, whether it needs a closing tag, and what other elements it can contain.
A Working Example
Read the sample once before copying it. Notice the element names and attribute values, then compare them with the explanation below.
<head>
<base href="https://example.com/tutorials/">
<title>Learning Portal</title>
</head>
<body>
<a href="lesson-1.html">Open lesson one</a>
</body>What Each Part Does
- The anchor is a link when its href points to a destination.
- The title gives the document a name in tabs and other browser surfaces.
- The head holds page metadata, not the visible lesson content.
- href is the URL or fragment destination of a link.
The relative link resolves beneath /tutorials/ on the given origin.
Try It Yourself
Try replacing the example content with your own while keeping the valid HTML structure.
Common Beginner Mistakes
- Adding base without checking how it changes existing fragment and resource URLs.
- Copying the code without checking whether its linked files or endpoints exist; sample addresses and file paths need real resources.
- Choosing a tag only because its default appearance looks right, without checking whether it describes the content correctly.
Key Takeaways
- Sets the base URL used to resolve relative links across the document. It can unexpectedly affect fragment links and other URLs.
- The relative link resolves beneath /tutorials/ on the given origin.
- Test the markup in a browser, and check accessibility and real-world behavior where relevant.