How do you define a base URL for all relative URLs in a document?-H5 Tutorial-php.cn

Table of Contents

Key Points:

Example:

Home

Web Front-end

H5 Tutorial

How do you define a base URL for all relative URLs in a document?

Abigail Rose Jenkins

Aug 17, 2025 am 11:34 AM

To define the base URL of all relative URLs in HTML documents, use the <base> element in

; 1. Place the <base> tag in and set the base URL through the href attribute, such as ; 2. Optionally use the target attribute to specify the default opening method of the link, such as \_blank; 3. Each document can only have one <base> element; 4. All relative URLs (such as How do you define a base URL for all relative URLs in a document?

) will be parsed based on the base, such as loading https://example.com/images/photo.jpg; 5. Once set, it will affect all relative links in the document and be set with caution.

How do you define a base URL for all relative URLs in a document?

To define a base URL for all relative URLs in an HTML document, you use the <base> element in the section of the document.

The <base> tag specifies the base URL and/or base target for all relative URLs used in the page. You can set it like this:

 <head>
  <base href="https://www.example.com/path/" target="_blank">
</head>

Key Points:

The href attribute sets the base URL for all relative links (like <a> , <img src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/175540164663803.jpeg" class="lazy" alt="How do you define a base URL for all relative URLs in a document?" > , <link> , <script> , etc.).
The target attribute (optional) defines the default opening context for links (eg, _blank , _self , _parent , _top ).
Only one <base> element is allowed per document.
All relative URLs in the document will be resolved relative to the base URL.

Example:

With this base:

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

Then this image tag:

 <img  src="/static/imghw/default1.png"  data-src="photo.jpg"  class="lazy" alt="How do you define a base URL for all relative URLs in a document?" >

...will load the image from https://example.com/images/photo.jpg .

Similarly, a link like:

 <a href="about.html">About</a>

...will point to https://example.com/images/about.html (unless the base path is overridden by server routing or other mechanisms).

⚠️ Important: Once set, the base URL affects all relative URLs in the document, so choose it carefully.

Basically, just place the <base> tag in the with the desired href , and the browser will resolve all relative URLs from that point onward.

The above is the detailed content of How do you define a base URL for all relative URLs in a document?. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn