Login.php

<? php

session_start ;

 comentario: 

'// "session_start" sirve para iniciar una sesión o reanudar la existencia, lo importante es la función "session_start" debe ser una llamada al principio del principio, antes de enviar cualquier salida al navegador. De otra forma, el error infame "Los encabezados ya están enviados" .'

include 'serv.php';

comentario:

//Include es una palabra clave que hace referencia a una instrucción al preprocesador que esta presente en la gran mayoría de lenguajes de alto y medio nivel, de forma genérica se usa para adicionar un archivo al código, Hace el llamado a el archivo "serv.php" para conectarse a la base de datos.

if(isset($_SESSION['user'])) {

 comentario: 

//Si el mensaje que envia el formulario atraves de el "user" es igual a el que esta en la base datos iniciara sesión y mostrara la pagina "panel.php", "isset" determina si una variable está definida y no es NULL, dicha función comprueba si una variable está definida o no en el script de PHP que se está ejecutando

echo ' window.location = "panel.php"; ';

 comentario: 

//La propiedad de sólo lectura  retorna un objeto   con información acerca de la ubicación actual del documento.

}

?>



Transparent login form desing

body {

margin: 0;

padding: 0;

background: url(image.jpg);

width: 100%;

height: 100%;

background-size: cover;

background-position: center;

font-family: sans-serif;

}

.login-box{

width: 300px;

height: 370px;

background: rgba(0, 0, 0, 0.5);

color: #fff;

top: 50%;

left: 50%;

position: absolute;

transform: translate(-50%,-50%);

box-sizing: border-box;

padding: 70px 38px;

border-radius: 10px;

}

.avatar{

width: 85px;

height: 100px;

border-radius:;

position: absolute;

top: -50px;

left: calc(50% - 50px);

}

h1{

margin: 0;

padding: 0 0 20px;

text-align: center;

font-size: 22px;

}

.login-box p{

margin: 0;

padding: 0;

font-weight: bold;

}

.login-box input{

width: 100%;

margin-bottom: 20px;

}

.login-box input[type="text"], input[type="password"]

{

border: none;

border-bottom: 1px solid #fff;

background: transparent;

outline: none;

height: 40px;

color: #fff;

font-size: 16px;

}

.login-box input[type="submit"]

{

border: none;

outline: none;

height: 40px;

background: #1C8ADB;

color: #fff;

font-size: 18px;

border-radius: 20px;

}

.login-box input[type="submit"]:hover

{

cursor: pointer;

background: #39DC79;

color:#000;

}

.login-box a{

text-decoration: none;

font-size: 14px;

color:#fff;

}

.login-box a:hover

{

color: #39DC79;

}



Iniciar Sesion



Nombre de Usuario



Contraseña



