-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathnvidia.html
118 lines (109 loc) · 6.72 KB
/
nvidia.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
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="nvidia.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>nvidia website</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" integrity="sha512-9usAa10IRO0HhonpyAIVpjrylPvoDwiPUiKdWk5t3PyolY1cOd4DSE0Ga+ri4AuTroPR5aQvXU9xC6qOPnzFeg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<body>
<div class="wrapper">
<header>
<!-- BARRE DE NAVIGATION -->
<nav>
<img class="nvid" src="nvidialogo.jpg" alt="logo nvidia"/>
<ul>
<li><a href="produit">PRODUITS</a></li>
<li><a href="gamme">GAMME RTX</a></li>
<li><a href="support">SUPPORT & PILOTES</a></li>
<li><a href="contact">CONTACT</a></li>
</ul>
</nav>
<!-- IMAGE RTX AVEC TEXTE DESSUS -->
<figure id="info">
<img class="rtx" src="rtx2060.png" alt="carte graphique 2060"/>
<figcaption>
<p>Plus d'informations sur la gamme GeForce RTX</p>
<a class="decouvrir" href="https://example.com"> Découvrir ▸</a>
</figcaption>
</figure>
</header>
<!-- ARTICLE -->
<main>
<div id="article">
<div class="puissance">
<img id=title src="icon.png" alt="nvida"/>
<h1>LA PUISSANCE, TOUT SIMPLEMENT.</h1>
</div>
<div>
<P>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Et quasi cupiditate incidunt excepturi aperiam, unde quibusdam eligendi quis deleniti reiciendis distinctio consequatur nihil facere nam reprehenderit, similique odio deserunt porro!Lorem ipsum dolor, sit amet consectetur adipisicing elit.
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Earum non distinctio nemo architecto reiciendis quibusdam sapiente repellendus voluptatibus accusantium soluta, id rem maxime sit unde a. Animi cum tempore quibusdam.
Et quasi cupiditate incidunt excepturi aperiam, unde quibusdam eligendi quis deleniti reiciendis distinctio consequatur nihil facere nam reprehenderit, similique odio deserunt porro!<br/><br/></p>
<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Consequuntur magnam, iure perspiciatis praesentium at tempore exercitationem vero eligendi placeat aliquam veritatis repellendus
consequatur voluptatum, sit, tenetur necessitatibus optio? Omnis, facere?Lorem ipsum dolor, sit amet consectetur adipisicing elit. Et quasi cupiditate incidunt excepturi aperiam, unde quibusdam eligendi quis deleniti reiciendis distinctio consequatur nihil facere nam reprehenderit, similique odio deserunt porro!<br/><br/></p>
<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Earum non distinctio nemo architecto reiciendis quibusdam sapiente repellendus voluptatibus accusantium soluta, id rem maxime sit unde a. Animi cum tempore quibusdam.
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Earum non distinctio nemo architecto reiciendis quibusdam sapiente repellendus voluptatibus accusantium soluta, id rem maxime sit unde a. Animi cum tempore quibusdam.
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Earum non distinctio nemo architecto reiciendis quibusdam sapiente repellendus voluptatibus accusantium soluta, id rem maxime sit unde a. Animi cum tempore quibusdam.</p>
</div>
</div>
<!-- A PROPOS -->
<aside>
<head>
<h1 class="propos">A PROPOS</h1>
</head>
<div class="proposblock">
<img class="logoblack" src="nvidialogoblack.jpg" alt="nvidia logo black"/>
<div class="text">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quis hic officiis laudantium quod explicabo reprehenderit! Quibusdam similique dicta totam. Id nam alias quaerat dicta commodi iusto rem tenetur quasi deleniti.<br/><br/></p>
<p> soluta quasi sed deserunt quidem iure, voluptates culpa!<br/><br/></p>
<p>nihil inventore cum.<br/><br/></p>
</div>
</div>
<p><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" integrity="sha512-9usAa10IRO0HhonpyAIVpjrylPvoDwiPUiKdWk5t3PyolY1cOd4DSE0Ga+ri4AuTroPR5aQvXU9xC6qOPnzFeg==" crossorigin="anonymous" referrerpolicy="no-referrer" /></p>
<div class="account">
<i class="fa-brands fa-facebook-f fa-2xl"></i>
<i class="fa-brands fa-twitter fa-2xl"></i>
<i class="fab fa-instagram fa-2xl"></i>
<i class="fab fa-linkedin-in fa-2xl"></i>
</div>
</aside>
</main>
<!-- Image triangle sur la ligne qui sépare le main du footer -->
<p id="blocktriangle"><img src="triangle.png" alt="triangle image" id="triangle"></p>
<footer>
<!-- NEWSLETTER -->
<section class="section-footer">
<h3>NEWSLETTER</h3>
<form class="formulaire" >
<div>
<input type="text" name="name" style="height: 30px;" id="name" required placeholder="Nom">
</div>
<div>
<input type="email" name="email" style="height: 30px;" id="email" required placeholder="Email">
<input class ="submit" type="submit" value="S'inscrire">
</div>
</form>
</section>
<!-- GALLERIE -->
<section class="section-footer">
<h3>GALLERIE</h3>
<div class="logo">
<img src="image1.png" alt="nvidia"/>
<img src="image2.png" alt="carte graphique"/>
<img src="image3.png" alt="carte graphique verticale"/>
<img src="image4.png" alt="losange"/>
</div>
</section>
<!-- PARTENAIRE -->
<section class="section-footer">
<h3>PARTENAIRES</h3>
<div class="logo">
<img src="intel.png" alt="nvidia"/>
<img src="asus.png" alt="asus"/>
<img src="EA.png" alt="EA"/>
</div>
</section>
</footer>
</div>
</body>