retouche
This commit is contained in:
parent
70c6cce8ae
commit
c56ba963f6
@ -16,30 +16,14 @@ header{
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
a{
|
||||||
|
outline: none;
|
||||||
#img_gauche_txt_droite{
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row-reverse;
|
|
||||||
justify-content: space-around;
|
|
||||||
align-items: center;
|
|
||||||
padding-bottom: 20vh;
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
#img_gauche_txt_droite p{
|
|
||||||
background-color: rgba(250,250,250,0.2);
|
|
||||||
backdrop-filter: blur(10px);
|
|
||||||
border-radius: 30px;
|
|
||||||
width: 40%;
|
|
||||||
padding: 1%;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
#img-txt div{
|
||||||
#img_droite_txt_gauche{
|
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
justify-content: space-around;
|
justify-content: space-around;
|
||||||
@ -48,39 +32,34 @@ header{
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
#img_droite_txt_gauche p{
|
|
||||||
background-color: rgba(250,250,250,0.2);
|
#img-txt p{
|
||||||
backdrop-filter: blur(10px);
|
backdrop-filter: blur(10px);
|
||||||
border-radius: 30px;
|
border-radius: 30px;
|
||||||
padding: 1%;
|
padding: 1%;
|
||||||
width: 40%;
|
width: 40%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.img_main{
|
.img_main{
|
||||||
backdrop-filter: blur(10px);
|
backdrop-filter: blur(10px);
|
||||||
height: 22rem;
|
height: 18rem;
|
||||||
width: 35rem;
|
width: 30rem;
|
||||||
border-radius: 15px;
|
border-radius: 15px;
|
||||||
transition: transform ease 0.4s;
|
transition: transform ease 0.4s;
|
||||||
filter: saturate(0.2);
|
filter: saturate(0.2);
|
||||||
}
|
}
|
||||||
|
|
||||||
.img_txt:hover .img_main{
|
#img-txt div:hover .img_main{
|
||||||
box-shadow: 0 40px 60px rgba(150,0,0,0.7);
|
box-shadow: 0 40px 60px rgba(150,0,0,0.7);
|
||||||
transform: scale(1.2,1.2);
|
transform: scale(1.2,1.2);
|
||||||
transition: transform ease 0.8s;
|
transition: transform ease 0.8s;
|
||||||
filter: saturate(1);
|
filter: saturate(1);
|
||||||
}
|
}
|
||||||
|
|
||||||
#img_gauche_txt_droite:not(:hover) p{
|
#img-txt div:not(:hover) p{
|
||||||
background-color: rgba(150,150,150,0.4);
|
background-color: rgba(150,150,150,0.4);
|
||||||
}
|
}
|
||||||
|
|
||||||
#img_droite_txt_gauche:not(:hover) p{
|
|
||||||
background-color: rgba(150,150,150,0.4);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -100,7 +79,7 @@ header{
|
|||||||
#fond_2 video{
|
#fond_2 video{
|
||||||
margin: 1%;
|
margin: 1%;
|
||||||
}
|
}
|
||||||
#
|
|
||||||
@media only screen and (max-width: 800px){
|
@media only screen and (max-width: 800px){
|
||||||
|
|
||||||
body{
|
body{
|
||||||
|
@ -57,8 +57,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
#ligne-colonne img{
|
#ligne-colonne img{
|
||||||
width: 20vw;
|
width: 15vw;
|
||||||
height: 30vh;
|
height: 25vh;
|
||||||
}
|
}
|
||||||
#ligne-colonne ul{
|
#ligne-colonne ul{
|
||||||
color: black;
|
color: black;
|
||||||
@ -67,7 +67,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
aside{
|
aside{
|
||||||
width: 50vw;
|
width: 40vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
#btn-contact{
|
#btn-contact{
|
||||||
|
@ -0,0 +1,3 @@
|
|||||||
|
nav,footer{
|
||||||
|
display: none;
|
||||||
|
}
|
10
CSS/propos.css
Normal file
10
CSS/propos.css
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
#cv-1-2{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#cv-1{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
@ -2,13 +2,17 @@ body{
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
p{
|
||||||
|
font-family:sans-serif ;
|
||||||
|
}
|
||||||
|
|
||||||
header{
|
header{
|
||||||
margin-bottom: 10vh;
|
margin-bottom: 10vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.txt_rouge{color: red;font-weight: bold;}
|
.txt_rouge{color: red;}
|
||||||
.txt_jaune{color: gold;font-weight: bold;}
|
.txt_jaune{color: gold;}
|
||||||
|
|
||||||
ul{
|
ul{
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@ -40,8 +44,9 @@ h3{
|
|||||||
font-size: 2em;
|
font-size: 2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
|
||||||
margin: 0;
|
a{
|
||||||
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav{
|
nav{
|
||||||
@ -159,6 +164,9 @@ nav li{
|
|||||||
|
|
||||||
|
|
||||||
main p{
|
main p{
|
||||||
|
font-weight: 100;
|
||||||
|
margin: 0;
|
||||||
|
text-align: justify;
|
||||||
font-size: 25px;
|
font-size: 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -4,6 +4,7 @@
|
|||||||
<title> Casino du coeur </title>
|
<title> Casino du coeur </title>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<link rel = "stylesheet" type = "text/css" href = "../CSS/styles.css">
|
<link rel = "stylesheet" type = "text/css" href = "../CSS/styles.css">
|
||||||
|
<link rel = "stylesheet" type = "text/css" href = "../CSS/propos.css">
|
||||||
<link rel = "stylesheet" type = "text/css" href = "../CSS/print.css" media="print">
|
<link rel = "stylesheet" type = "text/css" href = "../CSS/print.css" media="print">
|
||||||
<meta name="keywords" content="casino">
|
<meta name="keywords" content="casino">
|
||||||
<link rel = "icon" type = "/image/png" href = "../img/icon.png">
|
<link rel = "icon" type = "/image/png" href = "../img/icon.png">
|
||||||
@ -26,6 +27,25 @@
|
|||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
<main>
|
||||||
|
<div id="cv-1-2">
|
||||||
|
<div id="cv-1">
|
||||||
|
<h2> NOM </h2>
|
||||||
|
<div class="parcours-scolaire">
|
||||||
|
<ul>
|
||||||
|
<li> BUT Informatique </li>
|
||||||
|
<li> Baccalauréat général </li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="cv-2">
|
||||||
|
<h2> NOM2 </h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</main>
|
||||||
<footer>
|
<footer>
|
||||||
|
|
||||||
<div id="reseaux">
|
<div id="reseaux">
|
||||||
|
21
index.html
21
index.html
@ -55,10 +55,14 @@
|
|||||||
<h2>
|
<h2>
|
||||||
Qui sommes-nous ?
|
Qui sommes-nous ?
|
||||||
</h2>
|
</h2>
|
||||||
<div id="img_gauche_txt_droite" class="img_txt">
|
<div id="img-txt">
|
||||||
|
<div id="img_gauche_txt_droite">
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
ipsum <a href="HTML/page_4.html"><span class="txt_rouge"> dolor</span></a> sit amet, consectetur adipisicing elit, sed do eiusmod
|
ipsum <a href="HTML/page_4.html"><span class="txt_rouge"> <strong>dolor</strong></span></a> sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||||
|
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||||
|
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||||
|
adipisicing elit, sed do eiusmod
|
||||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||||
</p>
|
</p>
|
||||||
@ -70,15 +74,20 @@
|
|||||||
<h2>
|
<h2>
|
||||||
Nos valeurs
|
Nos valeurs
|
||||||
</h2>
|
</h2>
|
||||||
<div id="img_droite_txt_gauche" class="img_txt">
|
<div id="img_droite_txt_gauche">
|
||||||
|
<img class="img_main" src="img/casion_background.jpeg">
|
||||||
<p>
|
<p>
|
||||||
ipsum dolor sit amet,<a href="HTML/page_3.html"><span class="txt_rouge"> dolor </span></a>adipisicing elit, sed do eiusmod
|
ipsum dolor sit amet,<a href="HTML/page_3.html"><span class="txt_rouge"><strong> dolor</strong> </span></a>adipisicing elit, sed do eiusmod
|
||||||
|
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||||
|
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||||
|
adipisicing elit, sed do eiusmod
|
||||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||||
|
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<img class="img_main" src="img/casion_background.jpeg">
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
@ -87,7 +96,7 @@
|
|||||||
Notre devise : <span class="txt_rouge">Tout</span> le monde est <span class="txt_jaune">Gagnant</span> !
|
Notre devise : <span class="txt_rouge">Tout</span> le monde est <span class="txt_jaune">Gagnant</span> !
|
||||||
</h3>
|
</h3>
|
||||||
|
|
||||||
<video id="video-presentation" controls>
|
<video id="video-presentation" controls autoplay muted loop>
|
||||||
<source src="img/video_presentation.mp4" type="video/mp4">
|
<source src="img/video_presentation.mp4" type="video/mp4">
|
||||||
</video>
|
</video>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user