Sujet Précédent Sujet Suivant

Probleme css html php

Résolu/Fermé
yossra - 14 sept. 2020 à 13:57
 yossra - 16 sept. 2020 à 13:24
Bonjour, 

<?php
//Affichage erreurs php
error_reporting(E_ALL);
ini_set('display_errors', TRUE);
ini_set('display_startup_errors', TRUE);

// Constantes et autres variables
define('USER1','Stage');
define('PASSWORD1','Stage2020');
$message='';
$url_page2= "page2.php"; // variable à modifier selon tes besoins

// récupération propre des variables (POST/GET/SESSION...) AVANT de les utiliser
$username = !empty($_POST['username']) ? trim($_POST['username']) : NULL;
$password = !empty($_POST['password']) ? trim($_POST['password']) : NULL;

  //traitement du submit
if(isset($_POST['login'])){
  if(!$username  || !$password){
    $message='veuillez indiquer vos identifiants !';
  }elseif($username != USER1 || $password != PASSWORD1){
    $message='Vos identifiants sont faux. Merci de les vérifier';
  }elseif($username == USER1 || $password = PASSWORD1){
     // tout est ok... donc :
     header('location:'.$url_page2);
     exit; // toujours mettre un exit après une redirection
  }
}

?>
<code html>
<!DOCTYPE html>
<html>
    <head>
     <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
<style>
<code css>
* {
    box-sizing: border-box;
}
body{
    margin:0;
    height:100vh;
    width:100vw;
    overflow:hidden;
    font-family:'Lato' ,sans-serif;
    font-weight: 700;
    display: flex;
    align-items:center;
    justify-content:center;
    color:#555;
    background:#ecf0f3;

}
.login-div {
    width:430px;
    height:500px;
    padding:60px 35px 35px 35px;
    border-radius:40px;
    background:#ecf0f3;
    box-shadow:13px 13px 20px #cbced1,
                -13px -13px 20px #ffffff;
  }
  .fields {
    width:100%;
    padding:75px 5px 5px 5px;
  }
  .fields input {
    border:none;
    outline:none;
    background:none;
    font-size: 18px;
    color:#555;
    padding:20px 10px 20px 5px;
  }
  .username, .password {
    margin-bottom:30px;
    border-radius:25px;
    box-shadow: inset 8px 8px 8px #cbced1,
                inset -8px -8px 8px #ffffff;
  }
  .fields svg {
    height:22px;
    margin:0 10px -3px 25px;
  }
  .submit {
    outline:none;
    border:none;
    cursor: pointer;
    width:100%;
    height: 60px;
    border-radius:30px;
    font-size: 20px;
    font-weight: 700;
    font-family:'Lato',sans-serif;
    color:#fff;
    text-align:center;
    background:#24cfaa;
    box-shadow:3px 3px 8px #b1b1b1,
                -3px -3px 8px #ffffff;
    transition:0.5s;
  }
  .signin-button:hover {
    background:#2fdbb6;
  }
  .signin-button:active {
    background:#1da88a;
 }
</style>
  </head>
    <body>
        
        <div class="login-div">
            
            <div class="fields">
<form action="" method="post">
              <div class="username"><svg class="svg-icon" viewBox="0 0 20 20">
							<path d="M17.388,4.751H2.613c-0.213,0-0.389,0.175-0.389,0.389v9.72c0,0.216,0.175,0.389,0.389,0.389h14.775c0.214,0,0.389-0.173,0.389-0.389v-9.72C17.776,4.926,17.602,4.751,17.388,4.751 M16.448,5.53L10,11.984L3.552,5.53H16.448zM3.002,6.081l3.921,3.925l-3.921,3.925V6.081z M3.56,14.471l3.914-3.916l2.253,2.253c0.153,0.153,0.395,0.153,0.548,0l2.253-2.253l3.913,3.916H3.56z M16.999,13.931l-3.921-3.925l3.921-3.925V13.931z"></path>
						</svg><input type="username" class="user-input" placeholder="username" value="<?php echo htmlspecialchars($username);?>"/></div>
              <div class="password"><svg class="svg-icon" viewBox="0 0 20 20">
							<path d="M17.308,7.564h-1.993c0-2.929-2.385-5.314-5.314-5.314S4.686,4.635,4.686,7.564H2.693c-0.244,0-0.443,0.2-0.443,0.443v9.3c0,0.243,0.199,0.442,0.443,0.442h14.615c0.243,0,0.442-0.199,0.442-0.442v-9.3C17.75,7.764,17.551,7.564,17.308,7.564 M10,3.136c2.442,0,4.43,1.986,4.43,4.428H5.571C5.571,5.122,7.558,3.136,10,3.136 M16.865,16.864H3.136V8.45h13.729V16.864z M10,10.664c-0.854,0-1.55,0.696-1.55,1.551c0,0.699,0.467,1.292,1.107,1.485v0.95c0,0.243,0.2,0.442,0.443,0.442s0.443-0.199,0.443-0.442V13.7c0.64-0.193,1.106-0.786,1.106-1.485C11.55,11.36,10.854,10.664,10,10.664 M10,12.878c-0.366,0-0.664-0.298-0.664-0.663c0-0.366,0.298-0.665,0.664-0.665c0.365,0,0.664,0.299,0.664,0.665C10.664,12.58,10.365,12.878,10,12.878"></path>
						</svg><input type="password" class="pass-input" placeholder="password" value="<?php echo htmlspecialchars($password);?>"/></div>
            </div>
          <div class="submit">submit</div>
<?php 
      if(!empty($message)){
        echo '<div id="div_error">';
        echo '<p style="color:red;">'.$message.'</p>';
        echo '</div>';
      }
      ?>
          </div>
    </body></htm>
</code></code>

Configuration: Windows / Edge 85.0.564.51
A voir également:

4 réponses

Réponse 1 / 4
yossra
Modifié le 14 sept. 2020 à 14:45
j'ai un probléme dans ce code
0
Réponse 2 / 4
yossra
14 sept. 2020 à 14:50
page2: 
<!DOCTYPE html>
<html>
    <head>
     <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
<style><code css>
* {
    box-sizing: border-box;
}
body{
    margin:0;
    height:100vh;
    width:100vw;
    overflow:hidden;
    font-family:'Lato' ,sans-serif;
    font-weight: 700;
    display: flex;
    align-items:center;
    justify-content:center;
    color:#555;
    background:#ecf0f3;

}
.login-div {
    width:430px;
    height:700px;
    padding:60px 35px 35px 35px;
    border-radius:40px;
    background:#ecf0f3;
    box-shadow:13px 13px 20px #cbced1,
                -13px -13px 20px #ffffff;
  }
  .fields {
    width:100%;
    padding:75px 5px 5px 5px;
  }
  .fields input {
    border:none;
    outline:none;
    background:none;
    font-size: 18px;
    color:#555;
    padding:20px 10px 20px 5px;
  }
  .username {
    margin-bottom:30px;
    border-radius:25px;
    box-shadow: inset 8px 8px 8px #cbced1,
                inset -8px -8px 8px #ffffff;
  }
  .fields svg {
    height:22px;
    margin:0 10px -3px 25px;
  }
  .signin-button {
    outline:none;
    border:none;
    cursor: pointer;
    width:100%;
    height: 60px;
    border-radius:30px;
    font-size: 20px;
    font-weight: 700;
    font-family:'Lato',sans-serif;
    color:#fff;
    text-align:center;
    background:#24cfaa;
    box-shadow:3px 3px 8px #b1b1b1,
                -3px -3px 8px #ffffff;
    transition:0.5s;
  }
  .signin-button:hover {
    background:#2fdbb6;
  }
  .signin-button:active {
    background:#1da88a;
 }
</style>
  </head>
    <body>
        
        <div class="login-div">
            
            <div class="fields">
              <div class="username"><svg class="svg-icon" viewBox="0 0 20 20">
							<path d="M17.388,4.751H2.613c-0.213,0-0.389,0.175-0.389,0.389v9.72c0,0.216,0.175,0.389,0.389,0.389h14.775c0.214,0,0.389-0.173,0.389-0.389v-9.72C17.776,4.926,17.602,4.751,17.388,4.751 M16.448,5.53L10,11.984L3.552,5.53H16.448zM3.002,6.081l3.921,3.925l-3.921,3.925V6.081z M3.56,14.471l3.914-3.916l2.253,2.253c0.153,0.153,0.395,0.153,0.548,0l2.253-2.253l3.913,3.916H3.56z M16.999,13.931l-3.921-3.925l3.921-3.925V13.931z"></path>
						</svg><input type="username" class="user-input" placeholder="username" /></div>
           
            </div>
            <button class="signin-button">Login</button>

          </div>
    </body></html>
</code>
0
Réponse 3 / 4
Reivax962 Messages postés 3672 Date d'inscription jeudi 16 juin 2005 Statut Membre Dernière intervention 11 février 2021 1 011
14 sept. 2020 à 17:02
Bonjour,

Il faudrait que tu nous dises quel est ton problème dans ce code, on ne peut pas le deviner...
Donc, pour qu'on puisse t'aider :
- Qu'est-ce que tu voudrais comme résultat ?
- Qu'est-ce que tu obtiens, et qui ne te convient pas ?
- Quels sont les messages d'erreurs, s'il y en a ?

Xavier
0
Réponse 4 / 4
yossra
Modifié le 16 sept. 2020 à 13:25
merci j'ai résolu le probléme
0

Discussions similaires

la balise <br> ou <br />
faamugol -
rwaness -

8 réponses
<br> ou <br /> ou </br>
corentin.93 -
jessy006 -

11 réponses
Espace en HTML
baissaoui -
baissaoui -

0 réponse
trait horizontal avec du css
tipi75 -
tipi75 -

8 réponses
Que veut dire <p>&nbsp;</p>?
quinn mallory -
prosthetiks -

3 réponses