colocando css em um login
Olá pessoal eu tenho essa imagem de um login que vou mostrar aqui, consegui o css dela , porem não consegui colocar no meu login, eu vou deixar o login em html, em css eu estou dificuldade. Desde já agradeço a todos
então eu o css dela é esse aqui
*{margin:0; padding:0;}
html{
height:100%;
background: linear-gradient(rgba(38, 128, 101, 0.9), rgba(52, 177, 140, 0.9));
}.erros, .ok
{
width:390px;
padding:5px;
background:rgba(238, 249, 113, 0.9);
margin: 20px auto 0 auto;
border: 1px solid rgba(222,239,10,0.9);
border-radius: 4px;
color: #333;
}.ok{background: rgba(155,222,143,0.9);border-color: rgba(68, 171, 50, 0.9);color:white;}
body{
font-family: "Trebuchet MS", tahoma, arial;
}
#formulario{
width:500px;
margin:40px auto;
text-align:center;
position:relative;
}#formulario fieldset{
background:white;
border:0 none;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
box-shadow:0 0 15px 1px rgba(0,0,0, 0.4);
padding:20px 30px;
box-sizing: border-box;
width:80%;
margin:0 10%;
position:absolute;
}#formulario input, #formulario textarea{
padding:10px;
border:1px solid rgba(38, 128, 101, 0.9);
border-radius:4px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
outline:none;
box-sizing: border-box;
width:100%;
font:14px "Trebuchet MS", tahoma, arial;
color:#090;
margin-bottom:10px;
}#formulario .acao{
width:100px;
background:rgba(38, 128, 101, 0.9);
color:white;
text-transform:uppercase;
font-weight:bold;
padding:12px 0;
float:left;
margin-right:5%;
}#formulario .acao:hover{background:rgba(52, 177, 140, 0.9); cursor:pointer;}
Aqui abaixo é o html que eu não consegui deixar no css do jeito que está na imagem.
<!doctype html>
<html>
<?php
require_once"config.php";
?>
<head>
<title>APRENDIZ DE JS</title>
<link href="style.css" rel="stylesheet" type="text/css">
<script src="jquery-3.2.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#but_submit").click(function(){
var username = $("#meu_nome").val().trim();
var password = $("#minha_senha").val().trim();
if( username != "" && password != "" ){
$.ajax({
url:'pesquisar.php',
type:'post',
data:{username:username,password:password},
success:function(response){
var msg = "";
if(response == 1){
window.location = "home.php";
}else{
msg = "Invalid username and password!";
}
$("#message").html(msg);
}
});
}
});
});
</script>
</head>
<body>
<div class="container">
<div id="div_login">
<h1>Login</h1>
<div id="message"></div>
<div>
<input type="text" class="textbox" id="meu_nome" name="meu_nome" placeholder="Username" />
</div>
<div>
<input type="password" class="textbox" id="minha_senha" name="minha_senha" placeholder="Password"/>
</div>
<div>
<input type="button" value="logar" name="but_submit" id="but_submit" />
</div>
</div>
</div>
</body>
</html>Discussão (4)
Carregando comentários...