teratail
回答率
85.30%
質問するログイン新規登録
トップに関する質問JSPにCSSを反映したい

編集履歴

質問編集履歴

7

リファクタリング

2021/03/01 05:39

投稿

imotart
imotart

スコア17

title CHANGED
File without changes
body CHANGED
@@ -69,7 +69,7 @@
69
69
  > 念の為サーブレット側のコードも提示いただけますか？
70
70
  ブラウザの画面キャプチャも可能なら
71
71
 
72
- ~~開発中につき汚く、すみません。~~
72
+ ~~勉強中につき汚く、すみません。~~
73
73
  `LoginServlet.java`
74
74
  ```java
75
75
  package servlets;

6

サーブレットコードの追記

2021/03/01 05:39

投稿

imotart
imotart

スコア17

title CHANGED
File without changes
body CHANGED
@@ -13,7 +13,7 @@
13
13
  ![構成](6605bb353d0a46fce24c865e72f3b92a.png)
14
14
 
15
15
  ### ソース
16
- login.jsp
16
+ `login.jsp`
17
17
  ```jsp
18
18
  <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
19
19
  <!DOCTYPE html>
@@ -34,7 +34,7 @@
34
34
  </html>
35
35
  ```
36
36
 
37
- base.css
37
+ `base.css`
38
38
  ```css
39
39
  @charset "UTF-8";
40
40
 
@@ -62,4 +62,89 @@
62
62
  確かにh1に文字色青はわかりやすいとは思うのですけど
63
63
 
64
64
  指定してみましたが、やはり反映されません。
65
- ![イメージ説明](ad251c2c57d18636b2aea15c643e900d.png)
65
+ ![イメージ説明](ad251c2c57d18636b2aea15c643e900d.png)
66
+
67
+ ##### <追記3>
68
+ m.ts10806 様 - 2021/03/01 14:25
69
+ > 念の為サーブレット側のコードも提示いただけますか？
70
+ ブラウザの画面キャプチャも可能なら
71
+
72
+ ~~開発中につき汚く、すみません。~~
73
+ `LoginServlet.java`
74
+ ```java
75
+ package servlets;
76
+
77
+ import java.io.IOException;
78
+
79
+ import javax.servlet.RequestDispatcher;
80
+ import javax.servlet.ServletException;
81
+ import javax.servlet.annotation.WebServlet;
82
+ import javax.servlet.http.HttpServlet;
83
+ import javax.servlet.http.HttpServletRequest;
84
+ import javax.servlet.http.HttpServletResponse;
85
+
86
+ import beans.UserInfoBean;
87
+
88
+ /**
89
+ * Servlet implementation class LoginServlet
90
+ */
91
+ @WebServlet("/LoginServlet")
92
+ public class LoginServlet extends HttpServlet {
93
+ private static final long serialVersionUID = 1L;
94
+
95
+ /**
96
+ * @see HttpServlet#HttpServlet()
97
+ */
98
+ public LoginServlet() {
99
+ super();
100
+ // TODO Auto-generated constructor stub
101
+ }
102
+
103
+ /**
104
+ * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
105
+ */
106
+ protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
107
+ // TODO Auto-generated method stub
108
+ response.getWriter().append("Served at: ").append(request.getContextPath());
109
+
110
+ String view = "/WEB-INF/jsp/login.jsp";
111
+ RequestDispatcher dispatcher = request.getRequestDispatcher(view);
112
+ dispatcher.forward(request, response);
113
+
114
+ }
115
+
116
+ /**
117
+ * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
118
+ */
119
+ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
120
+ // ユーザログイン情報取得
121
+
122
+ UserInfoBean userInfo = new UserInfoBean();
123
+ userInfo.setUserId(request.getParameter("userId"));
124
+ userInfo.setUserPw(request.getParameter("userPw"));
125
+
126
+
127
+ // ユーザ認証
128
+ userInfo = Common.authUser(userInfo);
129
+
130
+
131
+ // セッションにユーザ情報を格納
132
+
133
+
134
+
135
+ // 画面表示
136
+ String view = "/WEB-INF/jsp/top.jsp";
137
+
138
+ request.setAttribute("userInfo", userInfo);
139
+
140
+ RequestDispatcher dispatcher = request.getRequestDispatcher(view);
141
+ dispatcher.forward(request, response);
142
+
143
+
144
+ }
145
+
146
+ }
147
+
148
+ ```
149
+ `実行画面`
150
+ ![イメージ説明](b1df9a62266a2d5a60322a67b1e6712f.png)

5

リファクタリング

2021/03/01 05:38

投稿

imotart
imotart

スコア17

title CHANGED
File without changes
body CHANGED
@@ -1,3 +1,4 @@
1
+ ### 質問
1
2
  基本的な質問ですが、jspにcssが反映されず困っております。
2
3
  `LoginServlet`実行→`login.jsp`フォワードの初期表示でcssの反映ができておりません。
3
4
 
@@ -7,10 +8,11 @@
7
8
  また、不足情報があれば追記させていただきます。
8
9
  よろしくお願いいたします。
9
10
 
10
- 構成
11
+ ### 構成
11
12
 
12
13
  ![構成](6605bb353d0a46fce24c865e72f3b92a.png)
13
14
 
15
+ ### ソース
14
16
  login.jsp
15
17
  ```jsp
16
18
  <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
@@ -41,16 +43,19 @@
41
43
  }
42
44
  ```
43
45
 
46
+
44
47
  ---
45
-
48
+ ### 追記情報
49
+ ##### <追記1>
46
- ##### <追記1> m.ts10806 様 - 2021/03/01 12:48
50
+ m.ts10806 様 - 2021/03/01 12:48
47
51
  > ブラウザに表示されたhtmlではどのようなパス表記になっていましたか？
48
52
 
49
53
  以下の通りです。
50
54
  `/ScheduleManager/css/base.css`
51
55
  ![イメージ説明](c8ddaed7342f9682485b1d36abfc9f0d.png)
52
56
 
57
+ ##### <追記2>
53
- ##### <追記2> m.ts10806 様 - 2021/03/01 14:04
58
+ m.ts10806 様 - 2021/03/01 14:04
54
59
  > 404エラーなくURLアクセスできるのでしたらキャッシュの影響は薄そうです。
55
60
  見ただけならCSSも問題はなさそう。
56
61
  bodyに背景色とか書いてみてください。明らかに違いがわかる指定ですね。

4

css背景指定

2021/03/01 05:27

投稿

imotart
imotart

スコア17

title CHANGED
File without changes
body CHANGED
@@ -42,7 +42,19 @@
42
42
  ```
43
43
 
44
44
  ---
45
- 追記
46
45
 
46
+ ##### <追記1> m.ts10806 様 - 2021/03/01 12:48
47
- ブラウザに表示されたパス表記
47
+ > ブラウザに表示されたhtmlではどのようなパス表記になっていましたか？
48
+
49
+ 以下の通りです。
50
+ `/ScheduleManager/css/base.css`
48
- ![イメージ説明](c8ddaed7342f9682485b1d36abfc9f0d.png)
51
+ ![イメージ説明](c8ddaed7342f9682485b1d36abfc9f0d.png)
52
+
53
+ ##### <追記2> m.ts10806 様 - 2021/03/01 14:04
54
+ > 404エラーなくURLアクセスできるのでしたらキャッシュの影響は薄そうです。
55
+ 見ただけならCSSも問題はなさそう。
56
+ bodyに背景色とか書いてみてください。明らかに違いがわかる指定ですね。
57
+ 確かにh1に文字色青はわかりやすいとは思うのですけど
58
+
59
+ 指定してみましたが、やはり反映されません。
60
+ ![イメージ説明](ad251c2c57d18636b2aea15c643e900d.png)

3

パス表記を追加しました。

2021/03/01 05:20

投稿

imotart
imotart

スコア17

title CHANGED
File without changes
body CHANGED
@@ -44,9 +44,5 @@
44
44
  ---
45
45
  追記
46
46
 
47
- ブラウザに表示されたパス表記は以下です。
47
+ ブラウザに表示されたパス表記
48
- `http://localhost:8080/ScheduleManager/LoginServlet`
49
- ![ブラウザに表示されたパス表記](513b510bb520c6e3dd54f10c3f9aa123.png)
50
-
51
- `http://localhost:8080/ScheduleManager/css/base.css`
52
- ![イメージ説明](25ba43038163475a1dc9f41abd287c07.png)
48
+ ![イメージ説明](c8ddaed7342f9682485b1d36abfc9f0d.png)

2

パス表記を追加しました。

2021/03/01 04:13

投稿

imotart
imotart

スコア17

title CHANGED
File without changes
body CHANGED
@@ -46,4 +46,7 @@
46
46
 
47
47
  ブラウザに表示されたパス表記は以下です。
48
48
  `http://localhost:8080/ScheduleManager/LoginServlet`
49
- ![ブラウザに表示されたパス表記](513b510bb520c6e3dd54f10c3f9aa123.png)
49
+ ![ブラウザに表示されたパス表記](513b510bb520c6e3dd54f10c3f9aa123.png)
50
+
51
+ `http://localhost:8080/ScheduleManager/css/base.css`
52
+ ![イメージ説明](25ba43038163475a1dc9f41abd287c07.png)

1

パス表記を追加しました。

2021/03/01 04:07

投稿

imotart
imotart

スコア17

title CHANGED
File without changes
body CHANGED
@@ -39,4 +39,11 @@
39
39
  h1 {
40
40
  color: blue;
41
41
  }
42
- ```
42
+ ```
43
+
44
+ ---
45
+ 追記
46
+
47
+ ブラウザに表示されたパス表記は以下です。
48
+ `http://localhost:8080/ScheduleManager/LoginServlet`
49
+ ![ブラウザに表示されたパス表記](513b510bb520c6e3dd54f10c3f9aa123.png)