pro/2026_WEBSITE_blochouse
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

wip split style

Browse Source
This commit is contained in:
hugo LAMY
2026-02-15 19:51:38 +01:00
parent 32007e7ada
commit 7de0c392c1
13 changed files with 463 additions and 421 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
www/artistes.html
View File

@@ -23,6 +23,13 @@
href="css/styles.css" href="css/styles.css"
title="Design" title="Design"
/> />
<link
rel="stylesheet"
media="screen"
type="text/css"
href="css/page_artistes.css"
title="Design"
/>
<script type="text/javascript" src="javascript/tools.js"></script> <script type="text/javascript" src="javascript/tools.js"></script>

7
www/ateliers.html
View File

@@ -24,6 +24,13 @@
href="css/styles.css" href="css/styles.css"
title="Design" title="Design"
/> />
<link
rel="stylesheet"
media="screen"
type="text/css"
href="css/page_ateliers.css"
title="Design"
/>
<script type="text/javascript"> <script type="text/javascript">
<!-- <!--

12
www/contact.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
@@ -26,6 +26,14 @@
href="css/styles.css" href="css/styles.css"
title="Design" title="Design"
/> />
<link
rel="stylesheet"
media="screen"
type="text/css"
href="css/page_contact.css"
title="Design"
/>
<script type="text/javascript" src="javascript/tools.js"></script> <script type="text/javascript" src="javascript/tools.js"></script>
<script type="text/javascript"> <script type="text/javascript">
@@ -44,7 +52,7 @@
preload( preload(
"images/logo_bloc_house.png", "images/logo_bloc_house.png",
"images/fond1.png", "images/fond1.png",
"images/mail.png" "images/mail.png",
); );
//--> //-->
</script> </script>

75
www/css/page_accueil.css Normal file
View File

@@ -0,0 +1,75 @@
/* page accueil */
#content {
float: left;
width: 480px;
height: 600px;
margin-left: 100px;
margin-top: 92px;
}
.diaporama {
position: relative;
width: 480px; /* Largeur d'une photo */
height: 360px; /* Hauteur d'une photo */
/*margin-top:30px;
margin-left:262px;*/
}
.diaporama li {
list-style-type: none;
overflow: hidden;
position: absolute; /* Les images seront positionnées toutes au même endroit */
}
.diaporama li a img {
width: 100%;
height: 100%;
}
.diaporama_controls {
width: 512px;
margin: 3px 0;
/* padding:5px;*/
clear: both;
overflow: hidden;
}
.diaporama_controls .btns {
float: right;
}
.diaporama_controls a {
font-weight: normal;
width: 10px;
/*height:13px;*/
text-indent: -9999px;
display: inline-block;
margin: 0 3px;
}
.diaporama_controls .prev {
background: url(img/fleches_diapo.png) no-repeat top right;
}
.diaporama_controls .next {
background: url(img/fleches_diapo.png) no-repeat top left;
}
.diaporama_controls .pause {
background: url(img/fleches_diapo.png) no-repeat bottom right;
}
.diaporama_controls .play {
background: url(img/fleches_diapo.png) no-repeat bottom left;
}
#texte {
float: left;
width: 480px;
height: auto;
font-size: 11px;
/*margin-top:15px;*/
padding-right: 10px;
text-align: justify;
}

53
www/css/page_artistes.css Normal file
View File

@@ -0,0 +1,53 @@
/* page artistes */
#content_artistes {
float: left;
width: 552px;
height: 552px;
margin-left: 70px;
margin-top: 92px;
}
.portrait a {
float: left;
width: 80px;
height: 80px;
margin-top: 5px;
margin-left: 5px;
border: 1px solid #000000;
}
.portrait a img {
width: 100%;
height: 100%;
}
.portrait a:hover {
border: 1px solid #cc3300;
}
.vide {
float: left;
width: 80px;
height: 80px;
margin-top: 5px;
margin-left: 5px;
border: 1px solid #000000;
}
.boite {
float: left;
width: 174px;
height: 174px;
}
#affichage {
float: left;
width: 167px;
height: 105px;
border: 1px solid #000000;
margin-left: 5px;
margin-top: 5px;
font-size: 12px;
text-align: center;
padding-top: 62px;
}

63
www/css/page_ateliers.css Normal file
View File

@@ -0,0 +1,63 @@
/* page ateliers */
#ateliers {
position: relative;
left: 100px;
top: 90px;
float: left;
width: 580px;
height: 600px;
}
#img_atelier {
background-color: #000000;
width: 480px;
/*height:336px;*/
height: 380px;
margin-top: 3px;
overflow: hidden;
}
#img_atelier img {
/*margin-top: 25px;*/
width: 100%;
height: 100%;
}
.legende {
width: 480px;
height: auto;
text-align: justify;
font-style: italic;
font-size: 11px;
color: #000000;
margin-top: 10px;
margin-left: 340px;
}
.artistes {
width: 480px;
height: auto;
text-align: justify;
font-size: 12px;
color: #000000;
margin-top: 30px;
}
#carton {
width: 480px;
height: 370px;
margin-top: 50px;
background-color: #000000;
}
.legende1 {
float: left;
width: 240px;
height: auto;
text-align: justify;
font-style: italic;
font-size: 11px;
color: #000000;
margin-top: 10px;
}

121
www/css/page_contact.css Normal file
View File

@@ -0,0 +1,121 @@
/* page de contact */
#contact {
position: relative;
left: 100px;
top: 90px;
float: left;
width: 580px;
height: 600px;
}
#News1 {
position: absolute;
top: 0px;
overflow: hidden;
width: 480px;
height: 530px;
display: none;
}
#News1 {
display: block;
}
#noir {
width: 480px;
height: 480px;
background-color: #000000;
}
#fauteuil {
background-image: url(../images/contact5.jpg);
background-repeat: no-repeat;
height: auto;
width: 480px;
margin-top: 3px;
}
#fauteuil p {
text-align: justify;
}
/*#contact_center{
height:442px;
width:280px;
margin-left:190px;
top:0px;
}*/
#adresse1 {
position: relative;
width: 250px;
height: 444px;
left: 205px;
top: 0px;
font-size: 11px;
line-height: 16px;
/*background-color:#d1d7d6;*/
/*border-top:1px solid #cccccc;
border-bottom:1px solid #cccccc;*/
}
#logo_p {
position: relative;
width: 200px;
left: 13px;
top: 30px;
}
#adresse1 p a {
color: #000000;
text-decoration: none;
}
#adresse1 p a:hover {
color: #cc3300;
text-decoration: none;
}
adresse1 td {
height: 11px;
width: auto;
}
.link a {
color: #000000;
text-decoration: none;
font-weight: bold;
}
.link a:hover {
color: #cc3300;
text-decoration: none;
font-weight: bold;
}
#marlei {
margin-left: 17px;
padding-top: 15px;
width: 480px;
height: 55px;
text-decoration: none;
line-height: normal;
}
#marlei a {
text-decoration: none;
color: #000000;
font-weight: bold;
}
#marlei a:hover {
text-decoration: none;
color: #cc3300;
font-weight: bold;
}
#mentions_legales {
width: 450px;
height: auto;
}

47
www/css/page_interstices.css Normal file
View File

@@ -0,0 +1,47 @@
/* page interstices */
#content_inter {
float: left;
height: 600px;
width: 570px;
margin-left: 70px;
margin-top: 92px;
}
#interstice {
float: left;
height: 520px;
width: 500px;
}
#survol {
float: left;
height: 520px;
width: 500px;
}
#chiffres {
float: left;
width: 30px;
height: 520px;
margin-left: 40px;
}
#chiffres p {
font-size: 18px;
font-weight: normal;
margin-bottom: 60px;
}
#chiffres p a {
color: #000000;
font-size: 18px;
font-weight: normal;
margin-bottom: 60px;
text-decoration: none;
}
#chiffres p a:hover {
color: #cc3300;
text-decoration: none;
}

34
www/css/page_partenaires.css Normal file
View File

@@ -0,0 +1,34 @@
/* page partenaires */
#lP {
float: left;
margin-top: -5px;
}
#haut {
float: left;
width: 480px;
height: 220px;
}
#bas {
float: left;
width: 480px;
height: 220px;
}
.partner {
float: left;
width: 200px;
height: 200px;
margin: 10px;
border: 1px solid #000000;
}
.partner1 {
float: left;
width: 200px;
height: 200px;
margin: 10px;
visibility: hidden;
}

399
www/css/styles.css
View File

@@ -171,405 +171,6 @@ body {
margin-left: 240px; margin-left: 240px;
} }
/* page accueil */
#content {
float: left;
width: 480px;
height: 600px;
margin-left: 100px;
margin-top: 92px;
}
.diaporama {
position: relative;
width: 480px; /* Largeur d'une photo */
height: 360px; /* Hauteur d'une photo */
/*margin-top:30px;
margin-left:262px;*/
}
.diaporama li {
list-style-type: none;
overflow: hidden;
position: absolute; /* Les images seront positionnées toutes au même endroit */
}
.diaporama li a img {
width: 100%;
height: 100%;
}
.diaporama_controls {
width: 512px;
margin: 3px 0;
/* padding:5px;*/
clear: both;
overflow: hidden;
}
.diaporama_controls .btns {
float: right;
}
.diaporama_controls a {
font-weight: normal;
width: 10px;
/*height:13px;*/
text-indent: -9999px;
display: inline-block;
margin: 0 3px;
}
.diaporama_controls .prev {
background: url(img/fleches_diapo.png) no-repeat top right;
}
.diaporama_controls .next {
background: url(img/fleches_diapo.png) no-repeat top left;
}
.diaporama_controls .pause {
background: url(img/fleches_diapo.png) no-repeat bottom right;
}
.diaporama_controls .play {
background: url(img/fleches_diapo.png) no-repeat bottom left;
}
#texte {
float: left;
width: 480px;
height: auto;
font-size: 11px;
/*margin-top:15px;*/
padding-right: 10px;
text-align: justify;
}
/* page artistes */
#content_artistes {
float: left;
width: 552px;
height: 552px;
margin-left: 70px;
margin-top: 92px;
}
.portrait a {
float: left;
width: 80px;
height: 80px;
margin-top: 5px;
margin-left: 5px;
border: 1px solid #000000;
}
.portrait a img {
width: 100%;
height: 100%;
}
.portrait a:hover {
border: 1px solid #cc3300;
}
.vide {
float: left;
width: 80px;
height: 80px;
margin-top: 5px;
margin-left: 5px;
border: 1px solid #000000;
}
.boite {
float: left;
width: 174px;
height: 174px;
}
#affichage {
float: left;
width: 167px;
height: 105px;
border: 1px solid #000000;
margin-left: 5px;
margin-top: 5px;
font-size: 12px;
text-align: center;
padding-top: 62px;
}
/* page interstices */
#content_inter {
float: left;
height: 600px;
width: 570px;
margin-left: 70px;
margin-top: 92px;
}
#interstice {
float: left;
height: 520px;
width: 500px;
}
#survol {
float: left;
height: 520px;
width: 500px;
}
#chiffres {
float: left;
width: 30px;
height: 520px;
margin-left: 40px;
}
#chiffres p {
font-size: 18px;
font-weight: normal;
margin-bottom: 60px;
}
#chiffres p a {
color: #000000;
font-size: 18px;
font-weight: normal;
margin-bottom: 60px;
text-decoration: none;
}
#chiffres p a:hover {
color: #cc3300;
text-decoration: none;
}
/* page ateliers */
#ateliers {
position: relative;
left: 100px;
top: 90px;
float: left;
width: 580px;
height: 600px;
}
#img_atelier {
background-color: #000000;
width: 480px;
/*height:336px;*/
height: 380px;
margin-top: 3px;
overflow: hidden;
}
#img_atelier img {
/*margin-top: 25px;*/
width: 100%;
height: 100%;
}
.legende {
width: 480px;
height: auto;
text-align: justify;
font-style: italic;
font-size: 11px;
color: #000000;
margin-top: 10px;
margin-left: 340px;
}
.artistes {
width: 480px;
height: auto;
text-align: justify;
font-size: 12px;
color: #000000;
margin-top: 30px;
}
#carton {
width: 480px;
height: 370px;
margin-top: 50px;
background-color: #000000;
}
.legende1 {
float: left;
width: 240px;
height: auto;
text-align: justify;
font-style: italic;
font-size: 11px;
color: #000000;
margin-top: 10px;
}
/* page de contact */
#contact {
position: relative;
left: 100px;
top: 90px;
float: left;
width: 580px;
height: 600px;
}
#News1 {
position: absolute;
top: 0px;
overflow: hidden;
width: 480px;
height: 530px;
display: none;
}
#News1 {
display: block;
}
#noir {
width: 480px;
height: 480px;
background-color: #000000;
}
#fauteuil {
background-image: url(../images/contact5.jpg);
background-repeat: no-repeat;
height: auto;
width: 480px;
margin-top: 3px;
}
#fauteuil p {
text-align: justify;
}
/*#contact_center{
height:442px;
width:280px;
margin-left:190px;
top:0px;
}*/
#adresse1 {
position: relative;
width: 250px;
height: 444px;
left: 205px;
top: 0px;
font-size: 11px;
line-height: 16px;
/*background-color:#d1d7d6;*/
/*border-top:1px solid #cccccc;
border-bottom:1px solid #cccccc;*/
}
#logo_p {
position: relative;
width: 200px;
left: 13px;
top: 30px;
}
#adresse1 p a {
color: #000000;
text-decoration: none;
}
#adresse1 p a:hover {
color: #cc3300;
text-decoration: none;
}
adresse1 td {
height: 11px;
width: auto;
}
.link a {
color: #000000;
text-decoration: none;
font-weight: bold;
}
.link a:hover {
color: #cc3300;
text-decoration: none;
font-weight: bold;
}
#marlei {
margin-left: 17px;
padding-top: 15px;
width: 480px;
height: 55px;
text-decoration: none;
line-height: normal;
}
#marlei a {
text-decoration: none;
color: #000000;
font-weight: bold;
}
#marlei a:hover {
text-decoration: none;
color: #cc3300;
font-weight: bold;
}
#mentions_legales {
width: 450px;
height: auto;
}
/* page partenaires */
#lP {
float: left;
margin-top: -5px;
}
#haut {
float: left;
width: 480px;
height: 220px;
}
#bas {
float: left;
width: 480px;
height: 220px;
}
.partner {
float: left;
width: 200px;
height: 200px;
margin: 10px;
border: 1px solid #000000;
}
.partner1 {
float: left;
width: 200px;
height: 200px;
margin: 10px;
visibility: hidden;
}
/** /**
* SCROLL BAR * SCROLL BAR
*/ */

11
www/index.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
@@ -26,6 +26,13 @@
href="css/styles.css" href="css/styles.css"
title="Design" title="Design"
/> />
<link
rel="stylesheet"
media="screen"
type="text/css"
href="css/page_accueil.css"
title="Design"
/>
<script <script
type="text/javascript" type="text/javascript"
@@ -72,7 +79,7 @@
"images/accueil/pageAccueil4.jpg", "images/accueil/pageAccueil4.jpg",
"images/accueil/pageAccueil9.jpg", "images/accueil/pageAccueil9.jpg",
"images/accueil/pageAccueil6.jpg", "images/accueil/pageAccueil6.jpg",
"images/accueil/pageAccueil7.jpg" "images/accueil/pageAccueil7.jpg",
); );
//--> //-->
</script> </script>

27
www/interstices.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
@@ -24,6 +24,13 @@
href="css/styles.css" href="css/styles.css"
title="Design" title="Design"
/> />
<link
rel="stylesheet"
media="screen"
type="text/css"
href="css/page_interstices.css"
title="Design"
/>
<script type="text/javascript" src="javascript/tools.js"></script> <script type="text/javascript" src="javascript/tools.js"></script>
@@ -62,7 +69,7 @@
"images/interstices/interstices5.jpg", "images/interstices/interstices5.jpg",
"images/interstices/interstices6.jpg", "images/interstices/interstices6.jpg",
"images/interstices/interstices7.jpg", "images/interstices/interstices7.jpg",
"images/interstices/interstices8.jpg" "images/interstices/interstices8.jpg",
); );
//--> //-->
</script> </script>
@@ -86,7 +93,7 @@
</script> </script>
</head> </head>
<body onload="javascript:initSurvol(0);"> <body onload="javascript: initSurvol(0);">
<div id="global"> <div id="global">
<div id="left"> <div id="left">
<div id="logo"> <div id="logo">
@@ -179,7 +186,7 @@
<a <a
href="#" href="#"
title="interstice 01" title="interstice 01"
onmouseover="javascript:text_over(1);" onmouseover="javascript: text_over(1);"
>I 1</a >I 1</a
> >
</p> </p>
@@ -187,7 +194,7 @@
<a <a
href="#" href="#"
title="interstice 02" title="interstice 02"
onmouseover="javascript:text_over(2);" onmouseover="javascript: text_over(2);"
>I 2</a >I 2</a
> >
</p> </p>
@@ -195,7 +202,7 @@
<a <a
href="#" href="#"
title="interstice 03" title="interstice 03"
onmouseover="javascript:text_over(3);" onmouseover="javascript: text_over(3);"
>I 3</a >I 3</a
> >
</p> </p>
@@ -203,7 +210,7 @@
<a <a
href="#" href="#"
title="interstice 04" title="interstice 04"
onmouseover="javascript:text_over(4);" onmouseover="javascript: text_over(4);"
>I 4</a >I 4</a
> >
</p> </p>
@@ -211,7 +218,7 @@
<a <a
href="#" href="#"
title="interstice 05" title="interstice 05"
onmouseover="javascript:text_over(5);" onmouseover="javascript: text_over(5);"
>I 5</a >I 5</a
> >
</p> </p>
@@ -219,7 +226,7 @@
<a <a
href="#" href="#"
title="interstice 06" title="interstice 06"
onmouseover="javascript:text_over(6);" onmouseover="javascript: text_over(6);"
>I 6</a >I 6</a
> >
</p> </p>
@@ -227,7 +234,7 @@
<a <a
href="#" href="#"
title="interstice 07" title="interstice 07"
onmouseover="javascript:text_over(7);" onmouseover="javascript: text_over(7);"
>I 7</a >I 7</a
> >
</p> </p>

28
www/partenaires.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
@@ -26,6 +26,13 @@
href="css/styles.css" href="css/styles.css"
title="Design" title="Design"
/> />
<link
rel="stylesheet"
media="screen"
type="text/css"
href="css/page_partenaires.css"
title="Design"
/>
<script type="text/javascript" src="javascript/tools.js"></script> <script type="text/javascript" src="javascript/tools.js"></script>
<script type="text/javascript"> <script type="text/javascript">
@@ -44,7 +51,7 @@
preload( preload(
"images/logo_bloc_house.png", "images/logo_bloc_house.png",
"images/fond1.png", "images/fond1.png",
"images/mail.png" "images/mail.png",
); );
//--> //-->
</script> </script>
@@ -67,7 +74,12 @@
</script> </script>
</head> </head>
<body onload="javascript:initPart();initPart1();"> <body
onload="
javascript: initPart();
initPart1();
"
>
<div id="global"> <div id="global">
<div id="left"> <div id="left">
<div id="logo"> <div id="logo">
@@ -151,8 +163,8 @@
<a <a
href="http://www.sceaux.fr" href="http://www.sceaux.fr"
title="Accéder au site internet de La ville de Sceaux" title="Accéder au site internet de La ville de Sceaux"
onmouseover="javascript:showLogo();" onmouseover="javascript: showLogo();"
onmouseout="javascript:initPart();" onmouseout="javascript: initPart();"
target="_blank" target="_blank"
><img ><img
id="p1" id="p1"
@@ -170,7 +182,7 @@
<a <a
href="" href=""
title="Accéder au site internet de " title="Accéder au site internet de "
onmouseover="javascript();" onmouseover="javascript()"
onmouseout="javascript:();" onmouseout="javascript:();"
target="_blank" target="_blank"
><img id="p3" src="" alt="" width="200" height="200" ><img id="p3" src="" alt="" width="200" height="200"
@@ -194,8 +206,8 @@
<a <a
href="http://www.oart.tv" href="http://www.oart.tv"
title="Accéder au site internet de oArt TV" title="Accéder au site internet de oArt TV"
onmouseover="javascript:showLogo1(3);" onmouseover="javascript: showLogo1(3);"
onmouseout="javascript:initPart1();" onmouseout="javascript: initPart1();"
target="_blank" target="_blank"
><img ><img
id="p2" id="p2"