how to load CSS file into jsp
Asked Answered
D

7

35

I created a jsp page as follows:

<%@ page contentType="text/css" %>
<html>
<head>
<title>Login page</title>
<link href="/css/loginstyle.css" rel="stylesheet" type="text/css">
</head>
<body>
<h1> India welfare</h1>
<p> welcome </p>
</body>
</html>

and named it as login.jsp

and i also created a css file called loginstyle.css and the code of the .css file is as follows:

body
{
background-color:#d0e4fe;
}
h1
{
color:orange;
text-align:center;
}
p
{
font-family:"Times New Roman";
font-size:20px;
}

the directory structure for css and jsp's are as follows: webcontent/welfare_web/css for .css files and webcontent/welfare_web/login for jsp files

the programming editor is eclipse and the server i am using is tomcat 7.0. when i am trying to run the login.jsp file using tomcat server. The css file is not showing any effect. i mean the output is normal text and is not as per the CSS file.

please help me how to make the .css file to effect the jsp file.

Disentail answered 12/9, 2011 at 1:46 Comment(0)
H
35

css href link is incorrect. Use relative path instead:

<link href="../css/loginstyle.css" rel="stylesheet" type="text/css">
Hollington answered 12/9, 2011 at 2:32 Comment(0)
R
33

I use this version

<style><%@include file="/WEB-INF/css/style.css"%></style>
Raymund answered 1/10, 2017 at 19:42 Comment(0)
M
32

You can write like that. This is for whenever you change context path you don't need to modify your jsp file.

<link rel="stylesheet" href="${pageContext.request.contextPath}/css/styles.css" />
Mcgrew answered 3/4, 2013 at 10:31 Comment(0)
P
11

I had the same problem too. Then i realized that in the MainPageServlet the urlPatterns parameter in @WebServlet annotation contained "/", because i wanted to forward to the MainPage if the user entered the section www.site.com/ . When i tried to open the css file from the browser, the url was www.site.com/css/desktop.css, but the page content was THE PAGE MainPage.jsp. So, i removed the "/" urlPattern and now i can use CSS files in my jsp file using one of the most common solutions (${pageContext.request.contextPath}/css/desktop.css). Make sure your servlet doesn't contain the "/" urlPattern. I hope this worked for u too, - Axel Montini

Piston answered 30/5, 2015 at 9:40 Comment(0)
F
2

if everything seems correct, and despite it still does not work I invite you to load the statics files in the web.xml like this

<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>/includes/*</url-pattern>
</servlet-mapping>

after

<!-- bootstrap css -->
<link rel="stylesheet" type="text/css" href="/includes/asserts/css/bootstrap.min.css"/>
Freida answered 27/6, 2021 at 1:18 Comment(0)
C
1

use this it worked for me

   <style><%@include file="/WEB-INF/view/style/style.css"%></style>
Curriery answered 20/7, 2022 at 9:4 Comment(0)
J
1

For CSS :

<link href="css/bootstrap.css" rel="stylesheet" type="text/css">

For JS :

<script type="text/javascript" src="js/bootstrap.js"></script>

Files location:

└───src
    └───main
        ├───java
        └───webapp
            ├───css/bootstrap.css
            ├───js/bootstrap.js
            ├───META-INF
            └───WEB-INF/index.jsp
                └───lib

css-js file location JSP

Janetjaneta answered 22/10, 2022 at 3:2 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.