Architecture complète du site revue, ajout de la page Automobile et de son style et ajout du style de la page perso. Il reste à faire le menu, les requetes php TP7, peut etre essayer de caler un float, faire le menu TP4, mettre les liens sites a 400px de hauteur, et rajouter l'ombre derriere le mur.
parent
5fbf3173e9
commit
fe477975c4
@ -0,0 +1,30 @@
|
||||
<!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>
|
||||
|
After Width: | Height: | Size: 4.0 MiB |
|
After Width: | Height: | Size: 4.1 MiB |
|
After Width: | Height: | Size: 3.1 MiB |
|
After Width: | Height: | Size: 3.2 MiB |
|
After Width: | Height: | Size: 2.2 MiB |
|
After Width: | Height: | Size: 3.9 MiB |
@ -0,0 +1,28 @@
|
||||
body {
|
||||
background-color: black;
|
||||
color: white;
|
||||
font-family: Arial, sans-serif;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.gallerie_images{
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 10px;
|
||||
max-width: 1200px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.gallerie_images img {
|
||||
width: 100%;
|
||||
border-radius: 8px;
|
||||
transition: transform 0.2s;
|
||||
}
|
||||
|
||||
.gallerie_images img:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
@ -0,0 +1,48 @@
|
||||
body {
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
font-family: 'Syncopate', sans-serif;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
margin-bottom: 20px;
|
||||
font-size: 2em;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border: 2px solid #fff;
|
||||
width: 80vw;
|
||||
background-color: #111;
|
||||
}
|
||||
|
||||
th, td {
|
||||
border: 1px solid #fff;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
th {
|
||||
background-color: #333;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
margin-top: 20px;
|
||||
font-size: 1.2em;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: grey;
|
||||
}
|
||||
Loading…
Reference in new issue