-
Notifications
You must be signed in to change notification settings - Fork 1
/
Paramedicale.html
94 lines (94 loc) · 3.86 KB
/
Paramedicale.html
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
89
90
91
92
93
94
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
body {
font-size: 16px;
color: rgba(0,0,0, o,87);
font-family: sans-serif;
line-height: 1.6;
margin: 0;
}
.reset {
float: left;
position: absolute;
height: 40px;
width: 40px;
margin-right: calc(100%-40px);
}
.banniere {
width: auto;
height: 300px;
margin-left: 40px;
}
.del {
position: absolute;
float: left;
width: 30%;
margin-left: 5%;
margin-right: 65%;
}
.secret {
position: absolute;
width: 30%;
margin-left: 35%;
margin-right: 30%;
}
.vend {
position: absolute;
float: right;
width: 30%;
margin-left: 66%;
margin-right: 5%;
}
.direct1 {
position: absolute;
float: left;
margin-top: 35%;
margin-bottom: 48%;
}
.direct1 img:hover{
opacity: 2;
color: black;
}
.direct2 {
float: right;
margin-left: 95%;
margin-top: 35%;
margin-bottom: 48%;
}
.direct2 img:hover{
opacity: 2;
color: black;
}
</style>
</head>
<body>
<div class="reset"><a href="Articles.html"><img src="previous.png" width="40px" height="40px"></a></div>
<div class="banniere"><img src="Banniere1.jpg" width="960px" height="300px"></div>
<div class="del">
<p>
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Adipisci, amet repellat a molestiae sit vero saepe nemo maxime fugit atque debitis dignissimos corrupti, vitae voluptas facilis odit nihil dolore omnis!
</p>
</div>
<div class="secret">
<p>
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Id dolore doloribus veritatis explicabo officiis sit ducimus sed, facere omnis consectetur eum quis accusamus sapiente deserunt doloremque? Laudantium non voluptas incidunt.
</p>
</div>
<div class="vend">
<p>
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Necessitatibus quam debitis vero fugit, dolor quasi magni recusandae architecto magnam consectetur repellendus corrupti dolorem aperiam eos exercitationem blanditiis earum obcaecati libero.
Eveniet possimus laudantium eum recusandae, dolores sequi a sapiente amet dicta, alias eligendi hic? Magnam accusamus blanditiis aliquid, eius architecto optio perspiciatis odio quam ratione inventore iste! Consequatur, necessitatibus optio.
Recusandae, pariatur perferendis quo ullam modi minima id velit natus dolore quod consectetur, voluptatibus officiis vero, minus est. Sequi qui nemo optio doloremque quas reiciendis dolorem ipsum recusandae, fugiat possimus!
Perferendis ratione veritatis sequi, sed repellendus unde ipsum veniam nisi enim incidunt, deleniti eum quod voluptates possimus sunt at corporis dolore! Amet, expedita! Quibusdam assumenda aliquid nisi perferendis in ducimus?
Corporis ab nam velit error repudiandae harum! Deserunt officiis veritatis doloremque beatae. Ipsa soluta sed ab, possimus cupiditate minima nulla ipsum quisquam, quidem beatae perspiciatis praesentium ipsam iure, mollitia non? </p>
</div>
<div class="direct1"><a href="Graphisme.html"><img src="left-arrow.png" width="40px" height="4%"></a></div>
<div class="direct2"><a href="Transport.html"><img src="suivant.png" width="40px" height="4%"></a></div>
</body>
</html>