質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.46%
JSP

JSP(Java Server Pages)とは、ウェブアプリケーションの表示レイヤーに使われるサーバーサイドの技術のことです。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

2回答

1032閲覧

jspファイルにcssを反映できない。

kdmn

総合スコア5

JSP

JSP(Java Server Pages)とは、ウェブアプリケーションの表示レイヤーに使われるサーバーサイドの技術のことです。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2021/08/09 17:18

編集2021/08/17 13:59

ヘディングのテキスト### 前提・実現したいこと

jspファイルにcssを反映できません。 
tangoChou.cssをlogin.jspに反映させたいです。
よろしく願いします。

login.jsp

jsp

1<%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3<% 4String errorMsg = (String) request.getAttribute("errorMsg"); 5%> 6<!DOCTYPE html> 7<html> 8<head> 9<meta charset="UTF-8"> 10<title>ログイン</title> 11<link rel="stylesheet" href="<%= request.getContextPath() %>/css/tangoChou.css" type="text/css"> 12</head> 13<body> 14 <h2>ログインしてください</h2> 15 <form action="/tangoChou/Login" method="post"> 16 メールアドレス<input type="email" name="email"><br> 17 パスワード<input type="password" name="pass"><br> 18 <input type="submit" value="ログイン"> 19 </form> 20 <% if(errorMsg != null) { %> 21 <p><%= errorMsg %></p> 22 <% } %> 23 <p>アカウントをお持ちでないですか?<a href="/tangoChou/Signup">登録する</a></p> 24</body> 25</html>

tangoChou.css

css

1@charset "UTF-8"; 2h2{ 3 color: red; 4}

イメージ説明

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

自己解決

なぜかはわかりませんがサーブレットファイルのMain.javaの@WebServlet("/")の部分を@WebServlet("/Main")に変更するとcssが反映されました。
その後またWebServlet("/")に戻してもcssが反映されていたのでちょっと謎なんですけど、
ルートが何かしらの不具合を起こしていたのかもしれません、、、、、
エンジニアの方がサーブレットのパスをルートにするのはオススメしないと言っていたので、
しない方がいいのかもしれません。
イメージ説明

投稿2021/08/20 04:53

編集2021/08/20 04:57
kdmn

総合スコア5

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

href="tangoChou/css/tangoChou.css"

これだと指定方法が相対パスになってます。
今のURLがhttp://example.com/tangoChou/login.jspだとしたら
http://example.com/tangoChou/tangoChou/css/tangoChou.cssを参照しに行っているはず(ブラウザの開発ツールから確認すれば分かります)

コンテキストパス使いましょう。(リンクの方も)

投稿2021/08/09 20:02

m.ts10806

総合スコア80861

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kdmn

2021/08/11 16:38

コンテキストパスを使ってhref="<%=request.getContextPath() %>/css/tangoChou.css"に変更したのですができません。(;_;) ご指摘いただけると幸いです。
m.ts10806

2021/08/11 23:26

「できません」とは。何が起きてるんでしょう。 コードも全体提示されないと何とも言えません。 サーブレット、CSSの質問は多くありますのでそちらもご参考に。 https://teratail.com/search?q=tag%3AServlet%2CCSS
kdmn

2021/08/12 08:20

ご指摘ありがとうございます。 「できません」というのはcssが反映できないということです。エラーも何も起きていなくて、ただcssに書いているjspファイルのh2に対するカラー変更の装飾ができないという状況です。 jspファイルのコードも全体提示に変更してみました。 勉強不足でわかりにくく申し訳ないです。m(_ _)m
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問