Savoirs communs

Outils pour utilisateurs

Outils du site

Piste:
design_slider

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
Prochaine révision 		Révision précédente
Prochaine révision Les deux révisions suivantes
design_slider [29/04/2019 15:48]
ilyes0537 		design_slider [29/04/2019 15:57]
ilyes0537
Ligne 7: Ligne 7:
  
 {{:photos:projet-evenements.png?400|}} {{:photos:projet-evenements.png?400|}}
 +________________________________________________________________________________________________________________
  
 2 - Mockup slide article V1 (svg):  2 - Mockup slide article V1 (svg): 
Ligne 142: Ligne 143:
   </body>   </body>
   </html>     </html>  
 +  
 +====Code CSS====
 +
 +
 +
 +  html{ height:100%; }
 +  body{ min-height:100%;  font-family: "sans-serif"; }
 +  header{ height: 38px; background: #58b344ff; color:#e6332aff; box-shadow: 1px 1px 5px 3px #666666ff; }
 +  header img{ width:300px; height:200px; z-index: 1000; position: absolute;}
 +  body {background-image: url(../img/logo-background.png);background-repeat: no-repeat;background-position: 5% center;background-
 +  size: 70%;font-size: 25px;}
 +  body::after {content: '';display: block;height: 50px; /* Set same as footer's height */}
 +  footer {background: #58b344ff;color: #fff;box-shadow: 1px 1px 5px 5px #666666ff;z-index: 10000;height: 48px;position: absolute;
 +  width: 100%;
 +  margin-top: 50%;
 +  padding-bottom: 28px;}
 +  footer img {width: 42%;position: absolute;right: 0;z-index: 10;bottom: 14px;}
 +  footer p{padding: 25px 0px 0px 5px;font-size: 27px;text-shadow: 2px 2px 2px #000;margin-left: 10%;}
 +  footer a, footer a:hover{ color:#fff; text-decoration: none; }
 +  article{margin: 3% 3% 3% 3%;height: 41%;position: absolute;}
 +  .container{    display: flex;/*border: 1px solid #000;*/ width: 100%; margin-top: 42vh; transform: translateY(-50%);z-index: 0;
 +   margin-left: 9vh;padding-top: 6%;}
 +  .gauche, .droite{ max-width: 50%; width:50%; }
 +  .gauche{background: #ffffff80; opacity: 0.8; border-radius: 20px; padding: 20px; text-align: justify; line-height: 36px; }
 +  .droite img{max-height: 89%;padding-left: 13vh;max-width: 67%;} 
 +  .gauche h1{ color:#e6332a; }
 +  .gauche h2{ padding: 18px; }
 +  .date h1{ color:#000000; }
 +  h1{ text-align: center; font-size: 53px; line-height: 35px; font-weight: 400; margin-bottom: 20px;}
 +
 +
 +
  
  
design_slider.txt · Dernière modification: 21/08/2020 13:25 (modification externe)

Outils de la page

Sauf mention contraire, le contenu de ce wiki est placé sous les termes de la licence suivante : CC Attribution-Share Alike 4.0 International
CC Attribution-Share Alike 4.0 International Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki