html - Netbeans WEB 应用程序元素无法读取 CSS 文件的相对路径

标签 html css jsp netbeans

我正在试用一本名为 “Murach 的 Java Servlet 和 JSP” 的书中的示例代码。出于某种原因,我无法让 CSS 工作。 Netbeans似乎没有找到 main.css使用 relative href 的文件路径。

index.html

<html>
    <head>
        <title>Murcah's Java Servlet and JSP</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="resources/css/main.css" type="text/css" />
    </head>
    <body>
        <h1>Join our email list</h1>
        <p>To join our email list, enter your name and email address below.</p>

        <form action="emailList" method="post">

            <input type="hidden" name="action" value="add" />

            <label>Email: </label>
            <input type="email" name="email" required /> <br />
            <label>First Name:</label>
            <input type="text" name="firstName" required /> <br/>
            <label>Last Name:</label>
            <input type="text" name="lastName" required /> <br />

            <label>&nbsp;</label>
            <input type="submit" value="Join Now" id="submit" />

        </form>
    </body>
</html>

ma​​in.css

body{
    font-family: Arial,Helvetica,sans-serif;
    font-size: 11pt;
    margin-left: 2em;
    margin-right: 2em;
    background-color: darkred;
    background: yellow;
}

h1{
    color:teal;
}

label{
    float:left;
    width:6em;
    margin-bottom: 0.5em;
}

input[type="text"], input[type="email"]{
    width: 15em;
    margin-left: 0.5em;
    margin-bottom: 0.5em;
}

br{
    clear:both;
}

#submit{
    margin-left: 0.5em;
}

context.xml

<?xml version="1.0" encoding="UTF-8"?>
<Context path="/ch02email"/>

下面是资源是如何组织到子文件夹中的。

enter image description here

main.css我相信的路径是ch02email/resources/css/main.css但是因为我已经将 contextPath 设置为

<?xml version="1.0" encoding="UTF-8"?>
    <Context path="/ch02email"/>

index.html 上你可以看到我的 href<link rel="stylesheet" href="resources/css/main.css" type="text/css" />

由于某些原因,CSS 不适用。另外,我试图查看源代码以打开 css,但我得到了 ff。

enter image description here

查看源代码 enter image description here

查看源代码我得到一个 404消息。

enter image description here

(查看源代码)

我在 Firefox 上都试过了和 Google Chrome但我得到了相同的结果。 CSS enter code here找不到文件。

我在这里错过了什么?我什至试着把 WEB-INF/resources/css/main.css据我所知,我认为不包括 WEB-INF 是不对的引用时。

最后,我尝试使用 <base href="${pageContext.request.contextPath}/"/>没有成功。

请帮忙。

谢谢。

最佳答案

我刚刚找到无法访问 main.css 文件的原因。我找到了资料here .我发现 WEB-INF 中包含的文件不可公开访问。所以我所做的就是像屏幕截图上那样移动 resources 文件夹。

enter image description here

resources 文件夹现在包含在 Web Pages 文件夹中。

enter image description here

我知道这是一个简单的问题,但因为我不知道的那个非常简单的细节而让我头疼。

我希望这对找到这篇文章的其他人有所帮助。 :)

关于html - Netbeans WEB 应用程序元素无法读取 CSS 文件的相对路径,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40400983/

相关文章:

java - 将希伯来字符插入 MySQL 表时出现问号

javascript - 使用 Javascript 防止点击链接

jquery - 向类中添加自定义伪 CSS

html - 将 css 背景图像设置为内联 SVG 符号?

css - 对于带有页眉和页脚的 2 列布局,我真的需要 css clear 吗?

jquery - 覆盖基本 jQuery-UI css 的简单方法?

javascript - 如何在 "onclick"事件期间加载外部 Javascript 文件?

mysql - 当我更新我的日期归档时没有更新。我正在使用 mysql 数据库

javascript - Bootstrap 3 默认验证插件

html - 如何在邮件中给box-shadow