Superposer une image sur une autre en relatif
Bonjour,
je désire positionner une image B au dessus d'une image A, en la calant en un point dont les coordonnées sont exprimés en pourcentage des largeur/hauteur de l'image A. je désire également que les dimensions de l'image B varie proportionnellement à l'image A lorsque je redimensionne par exemple la fenêtre du navigateur.
Actuellement le positionnement se fait par rapport à la fenêtre et non l'image A, et il me faut faire varier les dimensions de l'image B en fonction de celle de A
Merci pour un coup de main
Trachy
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
#image_accueil{
position:relative;top:0px;left:0px;
}
#image_accueil img {
max-width: 100%;
height: auto;
}
#barre_media{
position:absolute;
top:10%;
left:10%;
z-index:4;
}
#barre_media img {
max-width: 100%;
height: auto;
} |
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
| <!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tourisme </title>
<link rel="stylesheet" type="text/css" media="all" href="libcss/cyb/PDF_accueil_windows.css" />
</head>
<body >
<div id="image_accueil" ><img src="PDF_accueil.jpg" /><div id="barre_media"><img src="barre_media.jpg" /></div></div>
</body>
</html> |
