Java HTML 相对路径的写法
在 Java Web 开发中，我们经常需要使用相对路径来引用 HTML、CSS、JavaScript 等资源文件，相对路径是相对于当前 HTML 文件的路径，它的写法比较简单，只需要使用点(.)表示当前目录，两个点(..)表示上一级目录，下面我们详细介绍一下 Java HTML 相对路径的写法。
1、在 HTML 文件中引用 CSS 文件
在 HTML 文件中，我们可以使用 <link> 标签来引入外部 CSS 文件，我们有一个名为 style.css 的 CSS 文件，我们可以这样引用它：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>示例页面</title> <link rel="stylesheet" href="./style.css"> </head> <body> <h1>欢迎来到示例页面</h1> <p>这是一个简单的示例页面。</p> </body> </html>
2、在 HTML 文件中引用 JavaScript 文件
在 HTML 文件中，我们可以使用 <script> 标签来引入外部 JavaScript 文件，我们有一个名为 script.js 的 JavaScript 文件，我们可以这样引用它：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>示例页面</title> <script src="./script.js"></script> </head> <body> <h1>欢迎来到示例页面</h1> <p>这是一个简单的示例页面。</p> </body> </html>
3、在 HTML 文件中引用图片文件
在 HTML 文件中，我们可以使用 <img> 标签来引入外部图片文件，我们有一个名为 logo.png 的图片文件，我们可以这样引用它：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>示例页面</title> </head> <body> <h1>欢迎来到示例页面</h1> <p>这是一个简单的示例页面。</p> <img src="./logo.png" alt="示例图片"> </body> </html>
4、在 HTML 文件中引入其他资源文件(如字体、图标等)
除了上面提到的几种资源文件，还可以根据实际需求引入其他类型的资源文件，我们可以使用 Font Awesome 图标库，首先需要引入 jQuery、Font Awesome 的相关脚本和样式文件：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>示例页面</title> <!-引入 jQuery --> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <!-引入 Font Awesome --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"> </head> <body> <!-其他页面内容 --> </body> </html>
相关问题与解答
1、如何设置 Java Web 项目的资源文件夹？
答：在 Java Web 项目中，通常将资源文件夹(如 images、css、js、fonts、icons 等)放在项目的根目录下，如果需要使用相对路径引用这些资源文件，只需在 HTML、CSS、JavaScript 等文件中使用相对路径即可，如果 resources/images/logo.png 是项目根目录下的 logo.png 文件，那么在 HTML 文件中可以使用如下相对路径引用它：src="./images/logo.png"。
原创文章，作者：K-seo，如若转载，请注明出处：https://www.kdun.cn/ask/216185.html
微信扫一扫