Obrigado, Convidado!
Bem-vindo ao FMGARCIA - SAMP!
HuemersonFMG | ||||
CleidiSilva21 | ||||
barbfix | ||||
Tranks_NorT | ||||
RenatoFMG | ||||
William | ||||
Vinícius_ Kawasaki | ||||
scorpio | ||||
alfredw10 |
Simples Página de Login em HTML - Visual Studio Code
Simples Página de Login em HTML - Visual Studio Code
Simples Página de Login em HTML - Visual Studio Code
- Código:
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Página de Login || FMGarcia</title>
<style>
body {padding: 0; margin: 0; background-color: #6404ff;}
#login {display: flex; align-items: center; justify-content: center; height: 100vh; font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;}
.card {text-align: center; background-color: rgba(19, 19, 19, 0.3); padding: 40px; border-radius: 2px; width:280px;}
.card-header {padding-bottom: 50px; opacity: 0.8; color: #fff;}
.card-header::after {content: ""; width: 100%; height: 5px; background-color: rgb(223, 247, 7); display: block;margin-top: -17px; margin-left: -5px;}
.card-content label {color: #fff; font-size: 12px; opacity: 0.8;}
.card-content-area { display: flex; flex-direction: column; padding:10px 0;}
.card-content-area input {margin-top: 10px; padding:0 5px; background-color: transparent;border:none; border-bottom: 1px solid #e1e1e1; outline: none; color: #fff;}
.card-footer {display: flex; flex-direction: column;}
.card-footer .submit{width: 100%; height: 40px; background-color: #04f811; border:none; color:#300ada; margin: 10px 0; size: 30;}
.card-footer a {text-align: center; font-size: 30px; opacity: 0.8; color: #fff; text-decoration: none;}
</style>
</head>
<body>
<div id="login">
<form class="card">
<div class="card-header">
<h2>FM Garcia - Login</h2>
</div>
<div class="card-content">
<div class="card-content-area">
<label for="usuario">Usuário</label>
<input type="text" id="usuario" autocomplete="off">
</div>
<div class="card-content-area">
<label for="password">Senha</label>
<input type="password" id="password" autocomplete="off">
</div>
</div>
<div class="card-footer">
<input type="submit" value="LOGIN" class="submit">
<a href="#" class="recuperar_senha">Reculperar senha.</a>
</div>
</form>
</div>
</body>
</html>
HuemersonFMG- Fundador - ADM
- PublicaçõesPublicaçõesMembro VipMembro VipCriador de TópicosCriador de TópicosParticipação em tópicosParticipação em tópicosCriador de EventosCriador de EventosPopular no fórum - AmigosPopular no fórum - AmigosAvaliação de MSGAvaliação de MSGMelhores avaliações de AmigosMelhores avaliações de AmigosRei dos Grupos no FórumRei dos Grupos no FórumMelhor RPGRecebe este ao criar sua Ficha RPG no Perfil
- Mensagens : 506
Pontos : 26578
Reputação : 0
Data de inscrição : 11/06/2018
Idade : 51
Localização : Brasil
FMGRPG
FMG:
(200/100)
» Visual Studio Code
» HTML - Exemplo de Formulário - Simples - VSC
» Dicas da Microsoft - Criar um site simples usando HTML, CSS e JavaScript
» Como denunciar página de phishing
Qui 14 Mar 2024, 09:36 por HuemersonFMG
» Esqueceu o número do seu telefone?
Ter 05 Dez 2023, 12:51 por HuemersonFMG
» Scripts SQL - Oracle
Ter 05 Dez 2023, 11:56 por HuemersonFMG
» Dicas para Excel
Sex 27 Out 2023, 11:22 por HuemersonFMG
» Acentos e Caracteres Especiais em HTML
Sex 20 Out 2023, 13:17 por HuemersonFMG
» Dez motivos para consumir mais café...
Dom 27 Ago 2023, 05:09 por alfredw10
» Combinações de teclas do Windows
Dom 06 Ago 2023, 13:29 por HuemersonFMG
» PL/SQL - Extensão da linguagem SQL - Oracle
Qua 10 maio 2023, 10:16 por HuemersonFMG
» Node.js é uma tecnologia assíncrona
Ter 09 maio 2023, 11:21 por HuemersonFMG
» Pontos Cardeais
Seg 24 Abr 2023, 20:02 por HuemersonFMG
» 1º DE MAIO – DIA MUNDIAL DO TRABALHO
Seg 24 Abr 2023, 15:34 por HuemersonFMG
» ChatGPT - robô virtual (chatbot) que responde a perguntas variadas
Seg 20 Fev 2023, 11:23 por HuemersonFMG
» Simples Página de Login em HTML - Visual Studio Code
Seg 06 Fev 2023, 13:40 por HuemersonFMG
» HTML - Dicas interessantes
Qui 19 Jan 2023, 17:02 por HuemersonFMG
» https://phaser.io/ - para criar jogos HTML5
Ter 17 Jan 2023, 13:06 por HuemersonFMG