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;
}

                                    
Vers le haut

Vers le haut

Titre section avec une anmation style01

Titre section avec une anmation style01

Timeline style05

Timeline style05

Organization Chart

Organization Chart

Input range slider HTML style01

Input range slider HTML style01

Form Création de compte

Form Création de compte

Double Scrollbar with Plugin Jquery in table

Double Scrollbar with Plugin Jquery in table

Css Page grid layout

Css Page grid layout

Create icon animate with svg

Create icon animate with svg

Checkbox et boutons radios personnalisés en CSS

Checkbox et boutons radios personnalisés en CSS

Bootstrap3 Sidebar CSS

Bootstrap3 Sidebar CSS

Alert Bootstrap4 style01

Alert Bootstrap4 style01