izanic/SAE_WEB_S1
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

responsivité

Browse Source
This commit is contained in:
Hugo IZANIC 2024-01-19 10:33:58 +01:00
parent 0123b6916e
commit 58f13d1d95
8 changed files with 67 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
CSS/accueil.css
View File

@ -80,21 +80,33 @@ outline: none;
margin: 1%; margin: 1%;
} }
@media only screen and (max-width: 800px){ @media only screen and (max-width: 800px){
body{ h2{
width: 100vw; margin-bottom: 10vh;
} }
#img_droite_txt_gauche{ #presentation{
width: 100vw; height: 50vh;
}
.img_main{
width: 75vw;
margin-bottom: 20vh;
} }
#menu-ordi{ #img-txt p {
display: none; width: 100vw;
margin-bottom: 10vh;
}
#img-txt div{
flex-direction: column;
padding-bottom: 0;
} }
#menu-mobile{ #img_gauche_txt_droite{
position: fixed; flex-direction: column;
display: block; }
#fond_2 video{
width: 95vw;
} }
} }

2
CSS/propos.css
View File

@ -4,7 +4,7 @@ h1,h2,h3,h4,h5{
} }
#cv{ .cv{
display: inline-block; display: inline-block;
border: 1px solid red; border: 1px solid red;
padding: 1rem 1rem; padding: 1rem 1rem;

26
CSS/styles.css
View File

@ -210,8 +210,8 @@ footer #reseaux p{
} }
footer #reseaux li img{ footer #reseaux li img{
width: 3vw; width: 5vw;
height: 3vh; height: 5vh;
} }
footer #reseaux li img:not(:hover){ footer #reseaux li img:not(:hover){
@ -247,3 +247,25 @@ footer #autres a:hover{
display: none; display: none;
} }
@media only screen and (max-width: 800px){
*{
overflow-x: hidden;
}
footer a,footer p {
font-size: 7px;
}
#reseaux p{
display: none;
}
#menu-ordi{
display: none;
}
#menu-mobile{
position: fixed;
display: block;
}
}

8
HTML/contact.html
View File

@ -3,8 +3,10 @@
<head> <head>
<title> Casino du coeur </title> <title> Casino du coeur </title>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<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/contact.css"> <link rel = "stylesheet" type = "text/css" href = "../CSS/contact.css">
<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">
</head> </head>
@ -12,6 +14,12 @@
<header> <header>
<div id="menu-mobile">
<button>
a
</button>
</div>
<div id="menu-ordi"> <div id="menu-ordi">
<nav> <nav>

1
HTML/page_2.html
View File

@ -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">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<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">
</head> </head>

6
HTML/page_3.html
View File

@ -5,11 +5,17 @@
<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/partenaire.css"> <link rel = "stylesheet" type = "text/css" href = "../CSS/partenaire.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<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">
</head> </head>
<body> <body>
<header> <header>
<div id="menu-mobile">
<button>
a
</button>
</div>
<div id="menu-ordi"> <div id="menu-ordi">

9
HTML/page_4.html
View File

@ -5,6 +5,7 @@
<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/propos.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<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">
@ -28,7 +29,7 @@
</div> </div>
</header> </header>
<main> <main>
<div id="cv" class="cv-1"> <div id="cv-1" class="cv">
<aside id="marge"> <aside id="marge">
<ul> <ul>
<li> hugo.izanic@etu.u-pec.fr</li> <li> hugo.izanic@etu.u-pec.fr</li>
@ -96,7 +97,7 @@
</div> </div>
<div id="cv" class="cv-2"> <div id="cv-2" class="cv">
<aside id="marge"> <aside id="marge">
<ul> <ul>
<li> hugo.izanic@etu.u-pec.fr</li> <li> hugo.izanic@etu.u-pec.fr</li>
@ -182,8 +183,8 @@
<ul> <ul>
<li><a href="" target="_blank">Mentions légales</a></li> <li><a href="" target="_blank">Mentions légales</a></li>
<li><a href="" target="_blank">Conditions générales d'utilisation</a></li> <li><a href="" target="_blank">Conditions générales d'utilisation</a></li>
<li><a href="credits.txt" target="_blank">Crédits</a></li> <li><a href="../credits.txt" target="_blank">Crédits</a></li>
<li><a href="charte_graphique" target="_blank">Charte graphique</a></li> <li><a href="../charte_graphique" target="_blank">Charte graphique</a></li>
</ul> </ul>
</div> </div>

2
index.html
View File

@ -9,7 +9,7 @@
<link rel = "stylesheet" type = "text/css" href = "CSS/styles.css" media="all"> <link rel = "stylesheet" type = "text/css" href = "CSS/styles.css" media="all">
<link rel = "stylesheet" type = "text/css" href = "CSS/accueil.css" media="all"> <link rel = "stylesheet" type = "text/css" href = "CSS/accueil.css" media="all">
<meta name="keywords" content="casino"> <meta name="keywords" content="casino">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel = "icon" type = "image/png" href = "img/logo.svg"> <link rel = "icon" type = "image/png" href = "img/logo.svg">
</head> </head>