Form Création de compte

<!DOCTYPE html>
<html>
<head>
  <title>Formulaire - Créer un compte | par NGLESSON</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="author" content="Mezgani said">
  <meta name="copyright" content="NGLESSON">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  <link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
  <div class="container">
    <div class="row mt-5 mb-5">
    <div class="col-lg-6">
      <div class="form-login text-center">
          <img src="location-pin.svg" height="120px" width="120px" class="text-center img-responsive">
        <h1 class="text-bleu mt-3">Créer un compte et accédez à nos services. <span class="text-success">100% Gratuit</span></h1>
        <ul class="list-unstyled text-left" style="line-height: 2">
          <li><span class="fa fa-check text-success"></span> Ajouter votre établissement</li>
          <li><span class="fa fa-check text-success"></span> Référencer vos produits</li>
          <li><span class="fa fa-check text-success"></span> Publier vos moments</li>
          <li><span class="fa fa-check text-success"></span> Gérer votre établissement</li>
        </ul>
      </div>
    </div>
      <div class="col-lg-6">
      <div class="form-login">
          <div class="form-login-triangle"></div>
          <h2 class="form-login-header">Créer un compte</h2>
          <form class="form-login-body">
            <p><input type="text" id="inputname" name="inputname" autocomplete="on"  placeholder="Saisissez votre nom complet" required></p>
            <p><input type="email" id="inputemail" name="inputemail" autocomplete="on" placeholder="Saisissez votre email" email required></p>
            <p><input type="password" id="inputpass" name="inputpass" autocomplete="on"  placeholder="Saisissez votre mot de passe" required></p>
            <p><input type="submit" value="Créer un compte"></p>
          </form>
       </div>
      </div>
    </div>
  </div>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>  
</body>
</html>
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700);

body {
  background: transparent;
  font-family: 'Open Sans', sans-serif;
}

.form-login {
  width: 100%;
  margin: 40px auto;
  font-size: 16px;
}

.form-login .text-bleu{color:#28d;}

/* Reset top and bottom margins from certain elements */
.form-login-header,
.form-login p {
  margin-top: 0;
  margin-bottom: 0;
}

/* The triangle form is achieved by a CSS hack */
.form-login-triangle {
  width: 0;
  margin-right: auto;
  margin-left: auto;
  border: 12px solid transparent;
  border-bottom-color: #28d;
}

.form-login-header {
  background: #28d;
  padding: 20px;
  font-size: 1.4em;
  font-weight: normal;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
}

.form-login-body {
  background: #ebebeb;
  padding: 12px;
}

/* Every row inside .form-login-body is defined with p tags */
.form-login p {
  padding: 12px;
}

.form-login input {
  box-sizing: border-box;
  display: block;
  width: 100%;
  border-width: 1px;
  border-style: solid;
  padding: 16px;
  outline: 0;
  font-family: inherit;
  font-size: 0.95em;
}

.form-login input[type="email"],
.form-login input[type="text"],
.form-login input[type="password"] {
  background: #fff;
  border-color: #bbb;
  color: #555;
}

/* Text fields' focus effect */
.form-login input[type="email"]:focus,
.form-login input[type="text"]:focus,
.form-login input[type="password"]:focus {
  border-color: #888;
}

.form-login input[type="submit"] {
  background: #28d;
  border-color: transparent;
  color: #fff;
  cursor: pointer;
}

.form-login input[type="submit"]:hover {
  background: #17c;
}

/* Buttons' focus effect */
.form-login input[type="submit"]:focus {
  border-color: #05a;
}

                                    
Titre section avec une anmation style01

Titre section avec une anmation style01

SwiperJS Lazy Load Images

SwiperJS Lazy Load Images

Partager sur les réseaux sociaux

Partager sur les réseaux sociaux

Pagination with Jquery

Pagination with Jquery

Menu aside style01 slide out

Menu aside style01 slide out

Lightbox gallery style01

Lightbox gallery style01

Input valid invalid HTML CSS

Input valid invalid HTML CSS

Image hover style border top

Image hover style border top

Form login 02

Form login 02

Créer des tds dynamiquement dans une table html

Créer des tds dynamiquement dans une table html

Create icon animate with svg

Create icon animate with svg

Chercher un mot sur la liste

Chercher un mot sur la liste