Dernière ligne droite

master
Esteban JACQUES 3 weeks ago
parent fe477975c4
commit 72d649c0c8

@ -1,30 +0,0 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Galerie d'images</title>
<link rel="stylesheet" href="style_automobile.css">
</head>
<body>
<div class="gallerie_images">
<img src="automobile_photos/S1.png" alt="S1" title="Audi S1">
<img src="automobile_photos/RS4.png" alt="RS4" title="Audi RS4">
<img src="automobile_photos/R8.png" alt="R8" title="Audi R8">
<img src="automobile_photos/IMPREZA.png" alt="IMPREZA" title="Subaru IMPREZA WRX STI">
<img src="automobile_photos/RS4.png" alt="RS4" title="Audi RS4">
<img src="automobile_photos/R8.png" alt="R8" title="Audi R8">
<img src="automobile_photos/IMPREZA.png" alt="IMPREZA" title="Subaru IMPREZA WRX STI">
<img src="automobile_photos/S1.png" alt="S1" title="Audi S1">
<img src="automobile_photos/R8.png" alt="R8" title="Audi R8">
<img src="automobile_photos/IMPREZA.png" alt="IMPREZA" title="Subaru IMPREZA WRX STI">
<img src="automobile_photos/S1.png" alt="S1" title="Audi S1">
<img src="automobile_photos/AMG.png" alt="AMG" title="Mercedes A35 AMG">
<img src="automobile_photos/IMPREZA.png" alt="IMPREZA" title="Subaru IMPREZA WRX STI">
<img src="automobile_photos/S1.png" alt="S1" title="Audi S1">
<img src="automobile_photos/AMG.png" alt="AMG" title="Mercedes A35 AMG">
<img src="automobile_photos/RX7.png" alt="RX7" title="Mazda RX-7">
</div>
</body>
</html>

Before

Width:  |  Height:  |  Size: 518 KiB

After

Width:  |  Height:  |  Size: 518 KiB

Before

Width:  |  Height:  |  Size: 2.5 MiB

After

Width:  |  Height:  |  Size: 2.5 MiB

Before

Width:  |  Height:  |  Size: 4.3 MiB

After

Width:  |  Height:  |  Size: 4.3 MiB

Before

Width:  |  Height:  |  Size: 862 KiB

After

Width:  |  Height:  |  Size: 862 KiB

Before

Width:  |  Height:  |  Size: 862 KiB

After

Width:  |  Height:  |  Size: 862 KiB

Before

Width:  |  Height:  |  Size: 427 KiB

After

Width:  |  Height:  |  Size: 427 KiB

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 23 KiB

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 30 KiB

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 216 KiB

@ -11,7 +11,7 @@
<body>
<header><h1/>Ma vie étudiante</h1></header>
<header><h1>Ma vie étudiante</h1></header>
<a href="main">Revenir</a>

@ -1,31 +0,0 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Présentation longue</title>
</head>
<body>
<header><h1>Présentation longue</h1></header>
<article>
<div>
<p1>Présentation longue</p1>
</div>
<div>
<a href="main">Revenir</a>
</div>
</article>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.8 MiB

@ -0,0 +1,27 @@
#menu{
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 7vh;
background-color: darkslategrey;
display: flex;
justify-content: space-around;
align-items: center;
z-index: 10;
}
.liens_dans_le_menu{
height: 100%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
color: white;
}
.liens_dans_le_menu:hover{
color: black;
background-color: grey;
}

@ -1,15 +1,3 @@
.syncopate-regular {
font-family: "Syncopate", sans-serif;
font-weight: 400;
font-style: normal;
}
.syncopate-bold {
font-family: "Syncopate", sans-serif;
font-weight: 700;
font-style: normal;
}
#id_1{
font-family: 'Syncopate', sans-serif;
margin: 0;
@ -50,10 +38,56 @@
#id_1_1_1_2{
color: white;
position: relative;
margin: 0;
padding: 0;
width: 100%;
z-index: 1;
}
#id_1_1_1_3{
position: absolute;
right: 0;
width: 30vw;
height: 100%;
object-fit: cover;
box-shadow: -20px 0 10px rgba(0, 0, 0, 0.5);
z-index: 0;
}
#id_1_1_2{
position: absolute;
align-self: flex-end;
width: 100%;
height: 100%;
object-fit: cover;
z-index:-2
}
#id_1_1_3{
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 7vh;
background-color: darkslategrey;
display: flex;
justify-content: space-around;
align-items: center;
z-index: 10;
}
.liens_dans_le_menu{
height: 100%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
color: white;
}
.liens_dans_le_menu:hover{
color: black;
background-color: grey;
}
#id_1_2{
@ -92,7 +126,7 @@
justify-self: center;
object-fit: cover;
z-index: -1;
transition: filter 0.5s ease 0.3s;
transition: filter 0.5s ease 0.1s;
}
#id_1_2_4_2{
@ -128,7 +162,7 @@
height: 100%;
padding-right: 2vw;
padding-left: 2vw;
border-radius: 60px;
border-radius: 20%;
}

@ -1,20 +1,24 @@
header{
display: flex;
}
body {
background-color: black;
color: white;
font-family: Arial, sans-serif;
font-family: "Syncopate", sans-serif;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
height: 100vh;
margin: 0;
margin-top: 5vh;;
}
.gallerie_images{
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 10px;
max-width: 1200px;
width: 100%;
width: 65%;
}
.gallerie_images img {
@ -25,4 +29,4 @@ body {
.gallerie_images img:hover {
transform: scale(1.05);
}
}

@ -0,0 +1,14 @@
body{
font-family: 'Syncopate', sans-serif;
background-color: black;
display: flex;
align-items: baseline;
justify-content: center;
}
video{
height: 100vh;
width: auto;
margin: 0;
padding: 0;
}

@ -6,11 +6,11 @@ body {
flex-direction: column;
align-items: center;
justify-content: center;
margin: 0;
}
header h1 {
margin-bottom: 20px;
margin-top: 10vh;;
font-size: 2em;
text-align: center;
color: #fff;
@ -18,9 +18,9 @@ header h1 {
table {
display: block;
border-collapse: collapse;
border: 2px solid #fff;
width: 80vw;
background-color: #111;
}
@ -35,7 +35,7 @@ th {
font-weight: bold;
}
a {
#retour{
color: #fff;
text-decoration: none;
margin-top: 20px;
@ -43,6 +43,6 @@ a {
transition: color 0.3s;
}
a:hover {
a#retour:hover {
color: grey;
}

@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Galerie d'images</title>
<link rel="stylesheet" href="../css/style_automobile.css">
<link rel="stylesheet" href="../css/menu.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<header>
<div id="menu">
<a href="main" class="liens_dans_le_menu">Page principale</a>
<a href="Automobile" class="liens_dans_le_menu">Automobile</a>
<a href="Ski" class="liens_dans_le_menu">Ski</a>
<a href="Avion" class="liens_dans_le_menu">Aviation</a>
<a href="Informatique" class="liens_dans_le_menu">Informatique</a>
<a href="Perso" class="liens_dans_le_menu">Vie privée</a>
<a href="Etudes" class="liens_dans_le_menu">Vie étudiante</a>
</div>
</header>
<div class="gallerie_images">
<a href="../images_en_grand/RS4_B6"><img src="../automobile_photos/RS4_B6.png" alt="RS4_B6" title="Audi RS4 B6"></a>
<a href="../images_en_grand/RS4"><img src="../automobile_photos/RS4.png" alt="RS4" title="Audi RS4"></a>
<a href="../images_en_grand/R8"><img src="../automobile_photos/R8.png" alt="R8" title="Audi R8"></a>
<a href="../images_en_grand/IMPREZA"><img src="../automobile_photos/IMPREZA.png" alt="IMPREZA" title="Subaru IMPREZA WRX STI"></a>
<a href="../images_en_grand/RS4"><img src="../automobile_photos/RS4.png" alt="RS4" title="Audi RS4"></a>
<a href="../images_en_grand/R8"><img src="../automobile_photos/R8.png" alt="R8" title="Audi R8"></a>
<a href="../images_en_grand/IMPREZA"><img src="../automobile_photos/IMPREZA.png" alt="IMPREZA" title="Subaru IMPREZA WRX STI"></a>
<a href="../images_en_grand/S1"><img src="../automobile_photos/S1.png" alt="S1" title="Audi S1"></a>
<a href="../images_en_grand/R8"><img src="../automobile_photos/R8.png" alt="R8" title="Audi R8"></a>
<a href="../images_en_grand/IMPREZA"><img src="../automobile_photos/IMPREZA.png" alt="IMPREZA" title="Subaru IMPREZA WRX STI"></a>
<a href="../images_en_grand/S1"><img src="../automobile_photos/S1.png" alt="S1" title="Audi S1"></a>
<a href="../images_en_grand/AMG"><img src="../automobile_photos/AMG.png" alt="AMG" title="Mercedes A35 AMG"></a>
<a href="../images_en_grand/IMPREZA"><img src="../automobile_photos/IMPREZA.png" alt="IMPREZA" title="Subaru IMPREZA WRX STI"></a>
<a href="../images_en_grand/S1"><img src="../automobile_photos/S1.png" alt="S1" title="Audi S1"></a>
<a href="../images_en_grand/AMG"><img src="../automobile_photos/AMG.png" alt="AMG" title="Mercedes A35 AMG"></a>
<a href="../images_en_grand/RX7"><img src="../automobile_photos/RX7.png" alt="RX7" title="Mazda RX-7"></a>
</div>
</body>
</html>

@ -0,0 +1,29 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Galerie d'images</title>
<link rel="stylesheet" href="../css/menu.css">
<link rel="stylesheet" href="../css/style_avion.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<header>
<div id="menu">
<a href="main" class="liens_dans_le_menu">Page principale</a>
<a href="Automobile" class="liens_dans_le_menu">Automobile</a>
<a href="Ski" class="liens_dans_le_menu">Ski</a>
<a href="Avion" class="liens_dans_le_menu">Aviation</a>
<a href="Informatique" class="liens_dans_le_menu">Informatique</a>
<a href="Perso" class="liens_dans_le_menu">Vie privée</a>
<a href="Etudes" class="liens_dans_le_menu">Vie étudiante</a>
</div>
</header>
<video width="100%" autoplay muted>
<source src="../images/Avion.mp4" type="video/mp4">
Probleme engine kaput
</video>
</body>

@ -5,7 +5,8 @@
<meta charset="utf-8">
<link rel="stylesheet" href="style_perso.css">
<link rel="stylesheet" href="../css/style_perso.css">
<link rel="stylesheet" href="../css/menu.css">
<title>Ma vie perso</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
@ -18,7 +19,20 @@
<header><h1>Ma vie perso</h1></header>
<header>
<header>
<div id="menu">
<a href="main" class="liens_dans_le_menu">Page principale</a>
<a href="Automobile" class="liens_dans_le_menu">Automobile</a>
<a href="Ski" class="liens_dans_le_menu">Ski</a>
<a href="Avion" class="liens_dans_le_menu">Aviation</a>
<a href="Informatique" class="liens_dans_le_menu">Informatique</a>
<a href="Perso" class="liens_dans_le_menu">Vie privée</a>
<a href="Etudes" class="liens_dans_le_menu">Vie étudiante</a>
</div>
</header>
<h1>Ma vie perso</h1>
</header>
<table>
@ -128,7 +142,7 @@
</tr>
</table>
<a href ="main">Revenir</a>
<a href ="main" id="retour">Revenir</a>
</body>
</html>

@ -0,0 +1,94 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<LINK rel="stylesheet" type="text/css" href="../css/style.css">
<title>MyLife</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap" rel="stylesheet">
</head>
<body id="id_1">
<header id="id_1_1">
<div id = "id_1_1_1">
<img src="../images/moi3.png" alt="Ma grosse tete la" title="ça pousse" id="id_1_1_1_1"/>
<h1 id="id_1_1_1_2">Je m'apelle Esteban Jacques,</br></br>étudiant en première année de BUT informatique</h1>
<img src="../images/mur_noir" alt="Mur noir" title="Mur noir" id="id_1_1_1_3"/>
</div>
<img src="../images/mur.jpg" alt="Mur" title="Mur" id="id_1_1_2"/>
<div id="id_1_1_3">
<a href="main" class="liens_dans_le_menu">Page principale</a>
<a href="Automobile" class="liens_dans_le_menu">Automobile</a>
<a href="Ski" class="liens_dans_le_menu">Ski</a>
<a href="Avion" class="liens_dans_le_menu">Aviation</a>
<a href="Informatique" class="liens_dans_le_menu">Informatique</a>
<a href="Perso" class="liens_dans_le_menu">Vie privée</a>
<a href="Etudes" class="liens_dans_le_menu">Vie étudiante</a>
</div>
</header>
<section id="id_1_2">
<article id="id_1_2_1" class="conteneur_des_images_de_fond_pour_galeries_et_liens">
<a href="Automobile" class="liens_sur_images_de_fond_pour_galeries" id="id_1_2_1_1"><img src="../images/RS4.jpg" alt="automobile_photo" title="automobile_photo" id="id_1_2_1_1_1" class="images_de_fond_pour_galeries"/></a>
</article>
<article id="id_1_2_2" class="conteneur_des_images_de_fond_pour_galeries_et_liens">
<a href="Ski" class="liens_sur_images_de_fond_pour_galeries" id="id_1_2_2_1"><img src="../images/ski.jpg" alt="ski_photo" title="ski_photo" id="id_1_2_2_1_1" class="images_de_fond_pour_galeries"/></a>
</article>
<article id="id_1_2_3" class="conteneur_des_images_de_fond_pour_galeries_et_liens">
<a href="Avion" class="liens_sur_images_de_fond_pour_galeries" id="id_1_2_3_1"><img src="../images/avion.jpg" alt="avion_photo" title="avion_photo" id="id_1_2_3_1_1" class="images_de_fond_pour_galeries"/></a>
</article>
<article id="id_1_2_4" class="conteneur_des_images_de_fond_pour_galeries_et_liens">
<a href="Informatique" class="liens_sur_images_de_fond_pour_galeries" id="id_1_2_4_1"><img src="../images/matrix4k.jpg" alt="informatique_photo" title="informatique_photo" id="id_1_2_4_1_2" class="images_de_fond_pour_galeries"/></a>
<div id="id_1_2_4_2"></div>
</article>
</section>
<footer id="id_1_6">
<div id="id_1_6_1" class="conteneurs_des_images_et_paragraphes_pour_aller_sur_les_pages_de_vie">
<a href="Perso" class="liens_sur_images_pour_aller_sur_les_pages_de_vie" id="id_1_6_1_1"><img src="../images/cafe.jpg" alt="cafe" title="cafe" id="id_1_6_1_1_1" class="illustrations_pour_pages_de_vie"/></a>
<h1 id="id_1_6_1_2" class="paragraphes_pour_pages_de_vie">Vie personelle</h1>
</div>
<div id="id_1_6_2" class="conteneurs_des_images_et_paragraphes_pour_aller_sur_les_pages_de_vie">
<h1 id="id_1_6_2_2" class="paragraphes_pour_pages_de_vie">Vie étudiante</h1>
<a href="Etudes" class="liens_sur_images_pour_aller_sur_les_pages_de_vie" id="id_1_6_2_1"><img src="../images/amphi" alt="amphi" title="amphi" id="id_1_6_2_1_1" class="illustrations_pour_pages_de_vie"/></a>
</div>
<aside id="id_1_6_3">
<h2 id="id_1_6_3_1">Réseaux sociaux</h2>
<div id="id_1_6_3_2">
<ul id="id_1_6_3_2_1">
<li><a href="http://instagram.com"><img src="../images/insta.png" id="id_1_6_3_2_1_1" class="logos_réseaux_sociaux"></a></li>
<li><a href="http://x.com"><img src="../images/x.png" id="id_1_6_3_2_1_2" class="logos_réseaux_sociaux"></a></li>
<li><a href="http://youtube.com"><img src="../images/youtube.png" id="id_1_6_3_2_1_3" class="logos_réseaux_sociaux"></a></li>
<li><a href="http://discord.com"><img src="../images/discord.png" id="id_1_6_3_2_1_4" class="logos_réseaux_sociaux"></a></li>
</ul>
</div>
</aside>
</footer>
</body>
</html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 523 KiB

After

Width:  |  Height:  |  Size: 523 KiB

Before

Width:  |  Height:  |  Size: 3.9 MiB

After

Width:  |  Height:  |  Size: 3.9 MiB

Before

Width:  |  Height:  |  Size: 225 KiB

After

Width:  |  Height:  |  Size: 225 KiB

Before

Width:  |  Height:  |  Size: 1.9 MiB

After

Width:  |  Height:  |  Size: 1.9 MiB

Before

Width:  |  Height:  |  Size: 47 KiB

After

Width:  |  Height:  |  Size: 47 KiB

Before

Width:  |  Height:  |  Size: 77 KiB

After

Width:  |  Height:  |  Size: 77 KiB

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 22 KiB

Before

Width:  |  Height:  |  Size: 1.4 MiB

After

Width:  |  Height:  |  Size: 1.4 MiB

Before

Width:  |  Height:  |  Size: 732 KiB

After

Width:  |  Height:  |  Size: 732 KiB

Before

Width:  |  Height:  |  Size: 341 KiB

After

Width:  |  Height:  |  Size: 341 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 362 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

Before

Width:  |  Height:  |  Size: 3.6 MiB

After

Width:  |  Height:  |  Size: 3.6 MiB

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 22 KiB

Before

Width:  |  Height:  |  Size: 41 KiB

After

Width:  |  Height:  |  Size: 41 KiB

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>AMG</title>
<LINK rel="stylesheet" type="text/css" href="style_images_en_grand.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<img src="../automobile_photos/AMG.png" alt="Mercedes A45 AMG" title="Mercedes A45 AMG">
<a href="../html/Automobile">Retour</a>
</body>

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>IMPREZA</title>
<LINK rel="stylesheet" type="text/css" href="style_images_en_grand.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<img src="../automobile_photos/IMPREZA.png" alt="Subaru IMPREZA WRX STI" title="Subaru Natsuki">
<a href="../html/Automobile">Retour</a>
</body>

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>R8</title>
<LINK rel="stylesheet" type="text/css" href="style_images_en_grand.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<img src="../automobile_photos/R8.png" alt="Audi R8" title="Audi R8">
<a href="../html/Automobile">Retour</a>
</body>

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>RS4 B7</title>
<LINK rel="stylesheet" type="text/css" href="style_images_en_grand.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<img src="../automobile_photos/RS4.png" alt="Audi RS4 B7" title="Audi RS4 B7">
<a href="../html/Automobile">Retour</a>
</body>

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>RS4 B7</title>
<LINK rel="stylesheet" type="text/css" href="style_images_en_grand.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<img src="../automobile_photos/RS4_B6.png" alt="Audi RS4 B6" title="Audi RS4 B6">
<a href="../html/Automobile">Retour</a>
</body>

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>R8</title>
<LINK rel="stylesheet" type="text/css" href="style_images_en_grand.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<img src="../automobile_photos/RX7.png" alt="RX7" title="Mazda RX-7 FD3S">
<a href="../html/Automobile">Retour</a>
</body>

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>S1</title>
<LINK rel="stylesheet" type="text/css" href="style_images_en_grand.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<img src="../automobile_photos/S1.png" alt="S1" title="Audi S1">
<a href="../html/Automobile">Retour</a>
</body>

@ -0,0 +1,33 @@
.syncopate-regular {
font-family: "Syncopate", sans-serif;
font-weight: 400;
font-style: normal;
}
.syncopate-bold {
font-family: "Syncopate", sans-serif;
font-weight: 700;
font-style: normal;
}
body{
font-family: 'Syncopate', sans-serif;
background-color: black;
display: flex;
align-items: center;
flex-direction: column;
}
img{
height: 85vh;
}
a{
margin-top: 10vh;
color: white;
text-decoration: none;
}
a:hover{
color: grey;
}

82
main

@ -1,82 +0,0 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<LINK rel="stylesheet" type="text/css" href="style.css">
<title>MyLife</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap" rel="stylesheet">
</head>
<body id="id_1">
<header id="id_1_1">
<div id = "id_1_1_1">
<img src="moi3.png" alt="Ma grosse tete la" title="ça pousse" id="id_1_1_1_1"/>
<h1 id="id_1_1_1_2">Je m'apelle Esteban Jacques,</br></br>étudiant en première année de BUT informatique</h1>
</div>
</header>
<section id="id_1_2">
<article id="id_1_2_1" class="conteneur_des_images_de_fond_pour_galeries_et_liens">
<a href="Automobile" class="liens_sur_images_de_fond_pour_galeries" id="id_1_2_1_1"><img src="RS4.jpg" alt="automobile_photo" title="automobile_photo" id="id_1_2_1_1_1" class="images_de_fond_pour_galeries"/></a>
</article>
<article id="id_1_2_2" class="conteneur_des_images_de_fond_pour_galeries_et_liens">
<a href="Ski" class="liens_sur_images_de_fond_pour_galeries" id="id_1_2_2_1"><img src="ski.jpg" alt="ski_photo" title="ski_photo" id="id_1_2_2_1_1" class="images_de_fond_pour_galeries"/></a>
</article>
<article id="id_1_2_3" class="conteneur_des_images_de_fond_pour_galeries_et_liens">
<a href="Avion" class="liens_sur_images_de_fond_pour_galeries" id="id_1_2_3_1"><img src="avion.jpg" alt="avion_photo" title="avion_photo" id="id_1_2_3_1_1" class="images_de_fond_pour_galeries"/></a>
</article>
<article id="id_1_2_4" class="conteneur_des_images_de_fond_pour_galeries_et_liens">
<a href="Informatique" class="liens_sur_images_de_fond_pour_galeries" id="id_1_2_4_1"><img src="matrix4k.jpg" alt="informatique_photo" title="informatique_photo" id="id_1_2_4_1_2" class="images_de_fond_pour_galeries"/></a>
<div id="id_1_2_4_2"></div>
</article>
</section>
<footer id="id_1_6">
<div id="id_1_6_1" class="conteneurs_des_images_et_paragraphes_pour_aller_sur_les_pages_de_vie">
<a href="Perso" class="liens_sur_images_pour_aller_sur_les_pages_de_vie" id="id_1_6_1_1"><img src="cafe.jpg" alt="cafe" title="cafe" id="id_1_6_1_1_1" class="illustrations_pour_pages_de_vie"/></a>
<h1 id="id_1_6_1_2" class="paragraphes_pour_pages_de_vie">Vie personelle</h1>
</div>
<div id="id_1_6_2" class="conteneurs_des_images_et_paragraphes_pour_aller_sur_les_pages_de_vie">
<h1 id="id_1_6_2_2" class="paragraphes_pour_pages_de_vie">Vie étudiante</h1>
<a href="Etudes" class="liens_sur_images_pour_aller_sur_les_pages_de_vie" id="id_1_6_2_1"><img src="amphi" alt="amphi" title="amphi" id="id_1_6_2_1_1" class="illustrations_pour_pages_de_vie"/></a>
</div>
<aside id="id_1_6_3">
<h2 id="id_1_6_3_1">Réseaux sociaux</h2>
<div id="id_1_6_3_2">
<ul id="id_1_6_3_2_1">
<li><a href="http://instagram.com"><img src="insta.png" id="id_1_6_3_2_1_1" class="logos_réseaux_sociaux"></a></li>
<li><a href="http://x.com"><img src="x.png" id="id_1_6_3_2_1_2" class="logos_réseaux_sociaux"></a></li>
<li><a href="http://youtube.com"><img src="youtube.png" id="id_1_6_3_2_1_3" class="logos_réseaux_sociaux"></a></li>
<li><a href="http://discord.com"><img src="discord.png" id="id_1_6_3_2_1_4" class="logos_réseaux_sociaux"></a></li>
</ul>
</div>
</aside>
</footer>
</body>
</html>
Loading…
Cancel
Save