Problème CSS avec Java

**totot** · 22/07/2014, 16h27

Bonjour,

Je re-développe mon application que j'avais déjà développé en php en java web. Mon problème c'est que mon boostrap n'est pas pris en compte.
Je souhaiterai avoir la même interface que la première capture.
voici ma jsp:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>intranet</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
 
<!-- bootstrap -->
<link href="./assets/css/bootstrap/bootstrap.css" rel="stylesheet">
<link href="./assets/css/bootstrap/bootstrap-overrides.css"
	type="text/css" rel="stylesheet">
 
<!-- global styles -->
<link rel="stylesheet" type="text/css"
	href="./assets/css/compiled/layout.css">
<link rel="stylesheet" type="text/css"
	href="./assets/css/compiled/elements.css">
<link rel="stylesheet" type="text/css"
	href="./assets/css/compiled/icons.css">
 
<!-- libraries -->
<link rel="stylesheet" type="text/css"
	href="./assets/css/lib/font-awesome.css">
 
<!-- this page specific styles -->
<link rel="stylesheet" href="./assets/css/compiled/signin.css"
	type="text/css" media="screen" />
 
<!-- open sans font -->
<link
	href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,800italic,400,300,600,700,800'
	rel='stylesheet' type='text/css'>
 
<!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
<script src="./assets/js/jquery.js"></script>
<script src="./assets/js/jquery.min.js"></script>
<script type="text/javascript" src="./assets/js/controle.js"></script>
<script
	src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.pack.js"
	type="text/javascript"></script>
<script src="./assets/js/bootstrap.min.js"></script>
<script src="./assets/js/theme.js"></script>
</head>
<body>
	<!-- pre load bg imgs -->
	<script type="text/javascript">
		$(function() {
			// bg switcher
			var $btns = $(".bg-switch .bg");
			$btns.click(function(e) {
				e.preventDefault();
				$btns.removeClass("active");
				$(this).addClass("active");
				var bg = $(this).data("img");
 
				$("html").css("background-image",
						"url('./assets/img/bgs/" + bg + "')");
			});
 
		});
	</script>
 
	<div class="login-wrapper">
		<div class="box">
			<div class="content-wrap">
				<form id="signin" action="" method="post">
					<h6>Log in</h6>
					<label for="ident"><span class="help-required"></span></label> <input
						class="form-control required" role="input" aria-required="true"
						type="text" placeholder="Identifiant" name="ident" id="ident"
						value=""/> <label for="mdp"><span
						class="help-required"></span></label> <input class="form-control required"
						role="input" aria-required="true" type="password"
						placeholder="Mot de passe" name="mdp" id="mdp" value="" /> <a
						href="mdpPerdu.php" class="forgot">Mot de passe oublié ?</a> <input
						type="submit" value="Log in" name="submit" id="submitButton"
						class="btn-glow primary login"
						title="Cliquez ici pour vous connecter !" />
				</form>
			</div>
		</div>
	</div>
</body>
</html>

l'appel de l'image dans le fichier signin.css

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
.login-bg {
  background: url("../../img/bgs/blueish.jpg") no-repeat center center fixed;
  filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/bgs/landscape.jpg', sizingMethod='scale');
  -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/bgs/landscape.jpg', sizingMethod='scale')";
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

Merci de votre aide

**joel.drigo** · 22/07/2014, 16h53

Salut,

Il est où le java là ? Je ne vois que du javascript, du html, et du CSS ! Et ton problème de couleur, ce ne serait pas juste à cause du path "../../img/bgs/blueish.jpg", qui devrait être "../img/bgs/blueish.jpg" ?

**totot** · 22/07/2014, 17h12

Là j'ai juste fait voir ma jsp.
Sinon voici l'architecture des fichiers
dossier assets dans webContent
mon image se trouve dans assets/img/bgs
et mon css dans assets/css/compiled

**joel.drigo** · 22/07/2014, 17h25

Bah, je ne vois pas en quoi l'interprétation de la CSS pourrait dépendre d'exécution de code java, vu qu'il n'y en a pas (De jsp, je ne vois qu'une entête, qui définit l'encodage de la page et le content type). Par contre, je vois trois chemins relatifs à des images dans la CSS, mais qui ne sont pas au même niveau de dossier...

**totot** · 22/07/2014, 17h28

Les deux autres images je ne l'ai ai pu, je l'ai est supprimer du dossier et j'ai oublié d'enlever les liens.
En revanche j'ai fait comme tu m'a dit pour la première mais toujours rien

**joel.drigo** · 22/07/2014, 17h41

Si tu regardes ta page dans l'outil de développement de ton navigateur de test, tu vois si la CSS est chargée ?

Problème CSS avec Java

Développement Web en Java

Vue hybride

Discussions similaires

Partager

Partager