How to write relative path to base tag in HTML? (Instructions for use included)-HTML Tutorial-php.cn

Home

Web Front-end

HTML Tutorial

How to write relative path to base tag in HTML? (Instructions for use included)

寻∝梦

Aug 27, 2018 pm 07:12 PM

base html

This article mainly talks about how to use the relative path of the base tag in HTML. There are usage examples in it. Let’s take a look at it next.

First of all, let’s talk about the base in HTML Tags write the content of relative paths:

The base tag in html solves the problem of relative paths.

The problem is that the portal system has always used relative paths. The home page has been rewritten, and the home page has Many links (including css, js, pictures, etc.) are relative paths. I asked the portal system and couldn't solve it, so I could only use relative paths.

The cup is here, href="news/2014/05/25/1234.html" and similar links have become http://www.111cn.net /news/2014/05/25 The full path of /1234.html, and this path cannot be recognized as a portal system in nginx (nginx matches through /portal).

This is because: the browser will extract the URL of the current document to fill in the relative paths in all links in the HTML document.

Suddenly remembered the base tag of HTML, let’s look at the W3C’s explanation:

tag specifies the default address or default target for all links on the page.

Normally, the browser will extract the corresponding elements from the URL of the current document to fill in the gaps in the relative URL.

Use the tag to change this. The browser will then no longer use the URL of the current document, but will use the specified base URL to resolve all relative URLs. This includes URLs in , , ,

tags.

Usage example of base tag in html:

<head>
<base href="http://www.php.cn/i/" />
<base target="_blank" />
</head>
<body>
<img src="eg_smile.gif" />
<a href="http://www.php.cn">W3School</a>
</body>

Copy after login

The problem is solved.

Note: The domain name used in the article is real, but the path cannot be found.

It is best not to write the base tag dynamically, otherwise there will be a small bug in Firefox and IE, for example, for the page http://localhost/static/test.html:

## Examples of using the base tag in #html:

<html>
<head>
<script>
document.write(&#39;<base href="http://localhost/" />&#39;);
</script>
</head></p> <p><body>
<img src="static/1.jpg" />
</body>
</html>

Copy after login

The base tag is a base link tag and a single tag. Used to change the parameter default value for all link tags in the document. It can only be applied between the tags and .

Use the tag in html to obtain the relative path: (absolute paths are not supported)

The following is the description of in html Introduction:

The base element can specify the base URL of all links in the page

By default, the links in the page (including the addresses of style sheets, scripts and images) are Relative to the address of the current

page (ie: the request URL in the browser address bar).

We can use the href attribute in the tag to set all "relative base URLs".

What does the above mean? Let's take a look at the code and we'll know~~

This is the code on the JSP side, the code below (very similar to the JSP code in "Method 1" above)

But we didn't use it here ${pageScope.basePath} "relative path address" method,

now uses the tag in the html file:

<html>
<head>
<base href="http://localhost:8080/MyApp/">
</head>
<!-- // 设置了 <base>后，相对路径，相对于的就是base中的路径，而不再是浏览器
地址的请求路径啦~~~  -->
<a href="jsp/login.jsp">Login </a>
</html>

Copy after login

[Recommended by the editor 】

What does the head tag in HTML mean? An article teaches you how to use the head tag correctly

html

What element is the tag? Detailed explanation of the definition and function of html p tag

The above is the detailed content of How to write relative path to base tag in HTML? (Instructions for use included). 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