Skip to content
Snippets Groups Projects
Commit 9942f68e authored by Alx's avatar Alx
Browse files

update

parent b914cbf0
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
ROBAIL/La_cene.png → ROBAIL/img.png
+ 0
− 0
View file @ 9942f68e
File moved
ROBAIL/index.css 0 → 100644
+ 94
− 0
View file @ 9942f68e
/* Styles généraux */
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 0;
color: #333;
}
/* Conteneur principal */
#container {
display: flex;
justify-content: space-around;
align-items: flex-start;
margin: 20px;
padding: 20px;
background: white;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
border-radius: 10px;
}
/* Sections */
#container > div {
flex: 1;
padding: 10px;
text-align: center;
}
/* Titre */
h3 {
text-align: center;
font-size: 22px;
color: #444;
border-bottom: 2px solid #666;
padding-bottom: 5px;
margin-bottom: 15px;
}
/* WebGL Container */
#webGL {
width: 400px;
height: 400px;
background-color: #ddd;
border: 2px solid #999;
margin: 0 auto;
position: relative;
}
/* Légende des axes */
#axes_legend {
font-size: 16px;
font-weight: bold;
color: #000;
}
/* Image */
img {
max-width: 100%;
height: auto;
display: block;
margin: 0 auto;
border-radius: 5px;
}
/* Explications techniques */
h3 + p {
font-size: 20px;
text-align: left;
padding-left: 60px;
}
/* Ligne de séparation */
hr {
width: 70%;
margin: 20px auto;
border: 1px solid #ccc;
}
/* Responsive */
@media (max-width: 768px) {
#container {
flex-direction: column;
align-items: center;
}
#webGL {
width: 90%;
height: 300px;
}
h3 + p {
padding-left: 20px;
}
}
ROBAIL/index.html
+ 48
− 1
View file @ 9942f68e
Le travail n'a pas encore commencé!!!
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Projet webGL</title>
<link rel="stylesheet" href="index.css">
<script async src="https://unpkg.com/es-module-shims@1.3.6/dist/es-module-shims.js"></script>
<script type="importmap">
{
"imports": {
"three": "https://threejs.org/build/three.module.js",
"three/addons/": "https://threejs.org/examples/jsm/"
}
}
</script>
</head>
<body>
<div id="container">
<div>
<h3>Modèle</h3>
<div id="webGL">
</div>
</div>
<div>
<h3>La Cène, Léonard De Vinci, 1498</h3>
<img src="img.png" width="846" height="494" alt="La Cène, Léonard De Vinci, 1498"/>
</div>
</div>
<!-- Explication technique -->
<hr style="width: 70%; margin: 20px auto;">
<h3>Explications Techniques</h3>
<p style="font-size: 22px; text-align: left; padding-left: 60px">
A venir
<hr>
</p>
<script class="center" type="module" src="main.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</body>
</html>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment