html - JSP 不获取 bootstrap css (IDEA + Tomcat)

标签 html css jsp intellij-idea tomcat6

事情是这样的:我正在 IntellijIDEA 中创建一些带有 bootstrap css 的 html 文件(代码如下)。在浏览器中打开它,一切正常。

将该代码复制到 .jsp 文件,启动 Tomcat 服务器,css 不起作用。

<html>
<head>
<title>Money Transfer</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
<link href="bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="bootstrap/dist/css/bootstrap.css" rel="stylesheet" media="screen">

</head>

<body>
<form action="submit" method="get">
    <form class="form-horizontal" role="form">
        <div class="row">
            <div class="col-md-5 col-md-offset-4">
<h2 class="form-signing-heading">Money Transfer Form</h2></div>
        </div>

        <div class="form-group">
            <div class="row">
            <div class="col-md-1 col-md-offset-3"><label>Sender</label></div>
            <div class="col-md-3"><select name="sender" class="form-control">
                    <option value="John Doe">John Doe</option>
                    <option value="Mr.Smith">Mr.Smith</option>
                    <option value="ScratchCard">ScratchCard</option>
            </select></div>
        </div>
        </div>

        <div class="form-group">
            <div class="row">
            <div class="col-md-1 col-md-offset-3"><label>Receiver</label></div>
            <div class="col-md-3"><select name="receiver" class="form-control">
                    <option value="jane Doe">Jane Doe</option>
                    <option value="Mrs.Smith">Mrs.Smith</option>
                    <option value="System">System</option>
            </select></div>
        </div>
        </div>

        <div class="form-group">
        <div class="row">
            <div class="col-md-1 col-md-offset-3"><label>Amount</label></div>
            <div class="col-md-3">
                <div class="input-group">
        <input type="amount" class="form-control" placeholder="Amount" name="amount">
                    <span class="input-group-addon">$</span>
                </div>
            </div>
        </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-5">
                <button type="send" class="btn btn-success">Send</button>
                <button type="cancel" class="btn btn-link">Cancel</button>
            </div>
        </div>
    </form>
</form>

<script src="//code.jquery.com/jquery.js"></script>
<script src="bootstrap/dist/js/bootstrap.min.js"></script>

</body>
</html>

最佳答案

我认为相对路径有问题。 jsp 的相对路径和html 文件的相对路径不同。查看您的 jsp 页面后,请在浏览器中查看源代码并尝试打开这些 css 文件。您将收到一条错误消息。

我不知道你的元素文件/文件夹结构,但我建议在你的 jsp 文件中使用 servlet 上下文路径来计算你的 css 文件的正确路径。

使用 request.getContextPath() 获取 jsp 文件中的上下文路径,并使用此表达式组成 css/javascript 文件的完整路径。

如果 bootstrap 文件夹位于您的网络应用程序文件夹的根目录下,则使用此结构:

<link href="<%=request.getContextPath()%>/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" media="screen">

关于html - JSP 不获取 bootstrap css (IDEA + Tomcat),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19229795/

相关文章:

html - 背景大小封面加上背景附件固定在 IE11 中滚动的页面中不起作用

javascript - 如何获取 href 属性的完整 url?

javascript - 如何使用 JavaScript 检查 html 元标记是否存在?

html - div定位,奇怪的行为

html - 在一个div上放置几个div并改变大小

css - 如何使用 CSS position(relative, absolute) with percentage (height, width) 维度?

css - HTML 背景大小问题

javascript - 如何从框架中获取url?

java - JSP 对内部类使用 forEach

java - Sitemesh 有哪些替代方案可以帮助在 Spring MVC 应用程序中布局 JSP/JSTL 页面页脚/页眉?