Bonjour, je suis en train de créér un petit site web, et j'ai un problème sur une page. J'aimerais que, au survol d'un lien (class = "java" ou class = "python"), l'image de fond change. Je n'y arrive pas, ca ne marche pas et je ne sais pas pourquoi. Est ce que vous pourriez y jeter un coup d'oeil svp ? (pas de PHP merci.)
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<html>
<title>
Pro Tech - Programmation
</title>
<body>
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="prog.css" />
<p class = "menuBar"><br>
<img src = "carreVert.png"> PRO TECH <span class = "avancer"><a href = "index.html">ACCUEIL</a> <a href = "JAVA.html">PROGRAMMATION</a> <a href = "HACKING.html">HACKING</a> <a href = "BIO.html">QUI-SUIS-JE</a> <a href = "CONTACT.html">CONTACT</a></span><br><br>
</p>
</head>
<p class = "accueil">
<p class = "ensemblePresentation"><br><br>
<span class ="titre">Programmation</span>
<span class = "moyenTitre"> Vous êtes sur la page d'accueil de la section programmation. Choisissez le language qui vous intéresse ci-dessous.</span><br>
<span class = "moyenTitre"><a href = "#" class = "java">JAVA</a> <a href = "#" class = "python">PYTHON</a></span>
</p>
</p>
</body>
<html>
1
Et le CSS:
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
body{
background-image:url("codeGIF.gif");
background-size:cover;
margin:0;
width:100%;
height:100%;
background-repeat:no-repeat;
}
.menuBar{
color: black;
background-color:white;
font-family:'Light';
}
@font-face {
font-family:'Light';
src:url('Futura.ttf');
}
.titre{
color:white;
font-weight:bold;
font-family:'Light';
font-size: 250%;
margin-top:7%;
display:block;
text-align:center;
}
.moyenTitre{
color:white;
font-family:'Light';
display:block;
font-size:140%;
margin-top:15%;
text-align:center;
}
.ensemblePresentation{
background-color: rgba(237,28,36, 0.6);
max-width:40%;
min-height:88%;
margin-left:27%;
margin-top:-1.5%
}
a{
color:black;
text-decoration:none;
}
a:hover{
color:red;
text-decoration:bold;
}
.avancer{
margin-left:17%;
}
.java:hover body{
background-image:url("java.jpg");
width:100%;
height:100%;
background-repeat:no-repeat;
}
.python:hover body{
background-image:url("java.jpg");
width:100%;
height:100%;
background-repeat:no-repeat;
}
Afficher la suite