Probleme css html php
Résolu
yossra
-
yossra -
yossra -
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:
- Probleme css html php
- Editeur html - Télécharger - HTML
- Easy php - Télécharger - Divers Web & Internet
- Expert php pinterest - Télécharger - Langages
- Espace en html ✓ - Forum HTML
- Espace html ✓ - Forum Webmastering
4 réponses
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>