Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
Página de login em HTML
4 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1
Página de login em HTML
Detalhes da questão
Endereço do fórum: http://gsf-nwd.forumeiros.com/
Versão do fórum: phpBB3
Descrição
Boa noite!
Seguinte, eu tenha essa página HTML em meu fórum, porém não manjo muito, apenas um pouco, e alguns pessoas estão me falando que a função "Conexão automática" não está funcionando, toda vez que você entra no fórum tem que digitar o login e senha, queria que essa função, aparecesse que você estava conectado automaticamente, tem como resolver?
Re: Página de login em HTML
Olá @Wayne,
Então resumido a caixa de login existente na página principal (HTML): http://gsf-nwd.forumeiros.com/ não funciona, certo?
Se sim, passe-me ela para ver os erros.
Cordialmente,
pedxz.
Bem-vindo ao Fórum dos Fóruns!Seja bem-vindo ao Fórum dos Fóruns! Como acabou de se inscrever, veja aqui alguns links importantes a saber:
|
Se sim, passe-me ela para ver os erros.
Cordialmente,
pedxz.
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7964
Pontos : 9219
Re: Página de login em HTML
Use a tag code, que no editor é o que usa um ícone do código - uma folha com <>.
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7964
Pontos : 9219
Re: Página de login em HTML
- Código:
<meta content="text/html; charset=utf-8" http-equiv="content-type" /><title>Grove Street Families</title><link type="image/x-icon" href="https://i.imgur.com/jTwGEvJ.png" rel="icon" <div="" class="inner" />
<div style="display: none">
<a target="_blank" href="https://www.forumeiros.com">forumeiros.com</a>
</div>
<div class="bgbuttons">
<center>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<p>
</p>
<table>
</table>
</center>
<div class="buttons">
<li>
<a style="border-right: 1px solid rgba(0, 0, 0, 0.17);" href="http://gsf-nwd.forumeiros.com/forum">Fórum</a>
</li>
<li>
<a style="border-right: 1px solid rgba(0, 0, 0, 0.17);" href="http://gsf-nwd.forumeiros.com/f2-recrutamento">Peça seu Recrutamento</a>
</li>
<li>
<a target="_blank" style="border-right: 1px solid rgba(0, 0, 0, 0.17);" href="http://gsf-nwd.forumeiros.com/f5-revisao-de-banidos-expulsos">Revisão</a>
</li>
<li>
<a target="_blank" style="border-right: 1px solid rgba(0, 0, 0, 0.17);" href="http://gsf-nwd.forumeiros.com/t1441-discord-o-novo-ts">Discord</a>
</li>
</div>
</div>
<br />
<div class="logo">
<img src="https://i.imgur.com/Cn8b2yV.png" alt="Grove Street Families" title="Grove Street Families" left="5" style="width: 650px; height: 210px;" />
</div>
<div class="content2">
<div>
<div>
</div>
<p>
</p>
</div>
<div class="login">
<form name="form_login" method="post" action="/login">
<div class="frm_connexion">
<center>
<dl> <dt><label for="username">Nome de usuário:</label></dt> <dd><input class="inputfield" value="" maxlength="40" size="30" id="username" name="username" tabindex="1" type="text" /></dd> </dl> <dl> <dt><label for="password">Senha:</label></dt> <dd><input class="inputfield" maxlength="25" size="30" name="password" id="password" tabindex="2" type="password" /></dd> </dl> <dl> <dt></dt> <dd><label id="lbl_autologin" for="autologin"><input checked="checked" class="checkbox" tabindex="4" id="autologin" name="autologin" style="width: 12.2px;" type="checkbox" /> <span style="font-size: 13px;">Conexão Automática</span></label></dd> </dl>
</center>
</div>
<dl> <dt> </dt> <dd><input value="" name="redirect" type="hidden" /><input value="" name="query" type="hidden" /><input class="iheload-login" value="Login" tabindex="6" name="login" type="submit" /></dd> </dl>
<center>
<br /><span class="footerlogin">Ainda não possui conta no Fórum GSF? <a target="_blank" href="/register">Registre-se</a></span> <br /><span class="creditos">Página desenvolvida por <a href="/u1">[GSF]Brunelli</a></span>
</center>
</form>
</div>
<form style="display:none;" id="form2" enctype="multipart/form-data" onsubmit="return vB_Editor['text_editor'].prepare_submit(0,0)" name="post" method="post" action="http://gsf-nwd.forumeiros.com/">
<input name="username[]" value="" type="text" style="margin-top:2px" /> <input title="" maxlength="64" value="" name="subject" type="text" /><input value="" name="message" type="hidden" /><input value="" name="lt" type="hidden" /><input value="post" name="mode" type="hidden" /><input value="inbox" name="folder" type="hidden" /><input id="sendMP" accesskey="s" tabindex="6" value="Enviar" name="post" type="submit" />
</form><br /><embed style="width: 1px; height: 1px;" src="https://www.youtube.com/user/BrunelliK3/videos" /><style>
img.buttonssv:hover {
background: rgba(0, 0, 0, 0.2);
}
img.buttonssv {
transition: 0.8s;
}
.footerlogin {
font-size:12px;
}
.creditos {
font-size: 11px;
float: right ;
padding-bottom: 6px;
padding-top: 15px;
padding-right: 80px;
}
.login {
float: right;
margin-top: -12.6pc;;
padding: 0.1px 10px;
width: 355px;
color: #fff;
background-color: rgba(0, 0, 0, 0.66);
box-shadow: rgba(0,0,0,0.6) 0px 1px 6px;
border-radius: 4px;
}
.iheload-login {
border-color: #49825C;
border-bottom-color: #89C97B;
background: linear-gradient(to bottom, #9ED087, #216C58);
border-width: 1px;
border-style: solid;
box-shadow: inset 0px 1px 0 rgba(255,255,255,0.2);
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
color: #fff;
display: inline-block;
padding: 7px 20px;
border-radius: 4px;
outline: none;
cursor: pointer;
}
.iheload-login:hover {
border-color: #49825C;
border-bottom-color: #89C97B;
background: linear-gradient(to bottom, #9ED087, #30845E);
}
.iheload-login:active {
border-color: #49825C;
border-bottom-color: #89C97B;
background: linear-gradient(to bottom, #A7D393, #52A891);
}
dl {
margin-bottom: 10px;
font-size: 1.1em;
font-weight: 700;
}
dt {
width: 33%;
padding-top: 5px;
border: none;
float: left;
transition: .3s;
font-size: 13px;
}
dd {
padding: 5px;
padding-right: 5px;
margin-left: 32%;
vertical-align: middle;
}
body {
background: #f4f4f4 url(https://wallpaperscraft.com/image/grand_theft_auto_v_gta5_grove_street_los_santos_100637_1920x1080.jpg);
font-family: Arial;
background-size: 100% 100%;
}
input[type="text"],input[type="password"] {
padding: 7px;
outline: none;
margin-top: -6px;
text-shadow: none;
border: none;
width: 14.5pc;
font-family: Arial;
box-shadow: 0 0 5px #000;
border-radius: 3px;
}
.bgbuttons {
background: rgba(0, 0, 0, 0.66);
width: auto;
box-shadow: rgba(0,0,0,0.6) 0px 1px 6px;
min-width: 6em;
border-top: 6px solid rgba(0, 0, 0, 0);
border-bottom: 3px solid rgba(0, 0, 0, 0);
border: 0px;
padding: 5px;
border-radius: 4px;
}
.buttons {
font-family: Arial;
font-size: 100%;
color: white;
margin-top: -1pc!important;
bottom: 0px;
left: 0px;
right: 0px;
padding: 14px 0;
text-align: center;
}
.buttons li {
display: inline-block;
}
.buttons li a {
background: rgba(0, 0, 0, 0);
padding: 13px 17px;
color: white;
margin: -2.5px;
transition: .8s;
}
.buttons li a:hover {
background: rgba(0, 0, 0, 0.2);
color: #FFFFFF;
}
.content2 {
width: 840px;
border-top: 300px solid rgba(0, 0, 0, 0);
}
* {
text-shadow: 1px 1px 1px #000;
}
a {
text-decoration: none;
color: #8BBE89;
text-shadow: 1px 1px 1px #000;
transition: .8s;
}
a:hover {
color: #fff;
text-shadow: 0px 0px 2px #fff;
}
.logo img{
float: left;
width: 48%;
padding: 5px;
margin: -50px 10px 0px 320;
}
</style>
</div>
Vê se é isso que tu queres.
Re: Página de login em HTML
Olá @Wayne,
Troque o código da sua página HTML por este:
Até mais,
Fraise.
Titulo alterado de 'Página HTML' para 'Página de login em HTML'
Troque o código da sua página HTML por este:
- Código:
<meta content="text/html; charset=utf-8" http-equiv="content-type" />
<title>Grove Street Families</title>
<link type="image/x-icon" href="https://i.imgur.com/jTwGEvJ.png" rel="icon"
<div="" class="inner" />
<div style="display: none">
<a target="_blank" href="https://www.forumeiros.com">forumeiros.com</a>
</div>
<div class="bgbuttons">
<center>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<table></table>
</center>
<div class="buttons">
<li>
<a style="border-right: 1px solid rgba(0, 0, 0, 0.17);" href="http://gsf-nwd.forumeiros.com/forum">Fórum</a>
</li>
<li>
<a style="border-right: 1px solid rgba(0, 0, 0, 0.17);" href="http://gsf-nwd.forumeiros.com/f2-recrutamento">Peça seu Recrutamento</a>
</li>
<li>
<a target="_blank" style="border-right: 1px solid rgba(0, 0, 0, 0.17);" href="http://gsf-nwd.forumeiros.com/f5-revisao-de-banidos-expulsos">Revisão</a>
</li>
<li>
<a target="_blank" style="border-right: 1px solid rgba(0, 0, 0, 0.17);" href="http://gsf-nwd.forumeiros.com/t1441-discord-o-novo-ts">Discord</a>
</li>
</div>
</div>
<br />
<div class="logo">
<img src="https://i.imgur.com/Cn8b2yV.png" alt="Grove Street Families" title="Grove Street Families" left="5" style="width: 650px; height: 210px;" />
</div>
<div class="content2">
<div>
<div></div>
<p></p>
</div>
<div class="login">
<form name="form_login" method="post" action="/login">
<div class="frm_connexion">
<center>
<dl>
<dt>
<label for="username">Nome de usuário:</label>
</dt>
<dd>
<input class="inputfield" value="" maxlength="40" size="30" id="username" name="username" tabindex="1" type="text" />
</dd>
</dl>
<dl>
<dt>
<label for="password">Senha:</label>
</dt>
<dd>
<input class="inputfield" maxlength="25" size="30" name="password" id="password" tabindex="2" type="password" />
</dd>
</dl>
<dl>
<dt></dt>
<dd>
<label id="lbl_autologin" for="autologin">
<input type="checkbox" class="radio" checked="checked" tabindex="4" id="autologin" name="autologin" />
<span style="font-size: 13px;">Conexão Automática</span>
</label>
</dd>
</dl>
</center>
</div>
<dl>
<dt></dt>
<dd>
<input value="" name="redirect" type="hidden" />
<input value="" name="query" type="hidden" />
<input class="iheload-login" value="Login" tabindex="6" name="login" type="submit" />
</dd>
</dl>
<center>
<br />
<span class="footerlogin">Ainda não possui conta no Fórum GSF?
<a target="_blank" href="/register">Registre-se</a>
</span>
<br />
<span class="creditos">Página desenvolvida por
<a href="/u1">[GSF]Brunelli</a>
</span>
</center>
</form>
</div>
<form style="display:none;" id="form2" enctype="multipart/form-data" onsubmit="return vB_Editor['text_editor'].prepare_submit(0,0)" name="post" method="post" action="http://gsf-nwd.forumeiros.com/">
<input name="username[]" value="" type="text" style="margin-top:2px" />
<input title="" maxlength="64" value="" name="subject" type="text" />
<input value="" name="message" type="hidden" />
<input value="" name="lt" type="hidden" />
<input value="post" name="mode" type="hidden" />
<input value="inbox" name="folder" type="hidden" />
<input id="sendMP" accesskey="s" tabindex="6" value="Enviar" name="post" type="submit" />
</form>
<br />
<embed style="width: 1px; height: 1px;" src="https://www.youtube.com/user/BrunelliK3/videos" />
</div>
<style>
img.buttonssv:hover {
background: rgba(0, 0, 0, 0.2);
}
img.buttonssv {
transition: 0.8s;
}
.footerlogin {
font-size:12px;
}
.creditos {
font-size: 11px;
float: right ;
padding-bottom: 6px;
padding-top: 15px;
padding-right: 80px;
}
.login {
float: right;
margin-top: -12.6pc;;
padding: 0.1px 10px;
width: 355px;
color: #fff;
background-color: rgba(0, 0, 0, 0.66);
box-shadow: rgba(0,0,0,0.6) 0px 1px 6px;
border-radius: 4px;
}
.iheload-login {
border-color: #49825C;
border-bottom-color: #89C97B;
background: linear-gradient(to bottom, #9ED087, #216C58);
border-width: 1px;
border-style: solid;
box-shadow: inset 0px 1px 0 rgba(255,255,255,0.2);
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
color: #fff;
display: inline-block;
padding: 7px 20px;
border-radius: 4px;
outline: none;
cursor: pointer;
}
.iheload-login:hover {
border-color: #49825C;
border-bottom-color: #89C97B;
background: linear-gradient(to bottom, #9ED087, #30845E);
}
.iheload-login:active {
border-color: #49825C;
border-bottom-color: #89C97B;
background: linear-gradient(to bottom, #A7D393, #52A891);
}
dl {
margin-bottom: 10px;
font-size: 1.1em;
font-weight: 700;
}
dt {
width: 33%;
padding-top: 5px;
border: none;
float: left;
transition: .3s;
font-size: 13px;
}
dd {
padding: 5px;
padding-right: 5px;
margin-left: 32%;
vertical-align: middle;
}
body {
background: #f4f4f4 url(https://wallpaperscraft.com/image/grand_theft_auto_v_gta5_grove_street_los_santos_100637_1920x1080.jpg);
font-family: Arial;
background-size: 100% 100%;
}
input[type="text"],input[type="password"] {
padding: 7px;
outline: none;
margin-top: -6px;
text-shadow: none;
border: none;
width: 14.5pc;
font-family: Arial;
box-shadow: 0 0 5px #000;
border-radius: 3px;
}
.bgbuttons {
background: rgba(0, 0, 0, 0.66);
width: auto;
box-shadow: rgba(0,0,0,0.6) 0px 1px 6px;
min-width: 6em;
border-top: 6px solid rgba(0, 0, 0, 0);
border-bottom: 3px solid rgba(0, 0, 0, 0);
border: 0px;
padding: 5px;
border-radius: 4px;
}
.buttons {
font-family: Arial;
font-size: 100%;
color: white;
margin-top: -1pc!important;
bottom: 0px;
left: 0px;
right: 0px;
padding: 14px 0;
text-align: center;
}
.buttons li {
display: inline-block;
}
.buttons li a {
background: rgba(0, 0, 0, 0);
padding: 13px 17px;
color: white;
margin: -2.5px;
transition: .8s;
}
.buttons li a:hover {
background: rgba(0, 0, 0, 0.2);
color: #FFFFFF;
}
.content2 {
width: 840px;
border-top: 300px solid rgba(0, 0, 0, 0);
}
* {
text-shadow: 1px 1px 1px #000;
}
a {
text-decoration: none;
color: #8BBE89;
text-shadow: 1px 1px 1px #000;
transition: .8s;
}
a:hover {
color: #fff;
text-shadow: 0px 0px 2px #fff;
}
.logo img{
float: left;
width: 48%;
padding: 5px;
margin: -50px 10px 0px 320;
}
</style>
Até mais,
Fraise.
Titulo alterado de 'Página HTML' para 'Página de login em HTML'
Re: Página de login em HTML
Parece que o problema ainda persiste. Não teria como fazer um sistema que aparecesse na mesma caixa de login, que você está conectado? Porque ela não está salvando, toda vez que entra tem que digitar login e senha.
Re: Página de login em HTML
Troque a sua página para está:
Fiz uma pequena limpeza a página
- Código:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Grove Street Families</title>
<link type="image/x-icon" href="https://i.imgur.com/jTwGEvJ.png" rel="icon" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style type="text/css">
body {
background: #f4f4f4 url(https://wallpaperscraft.com/image/grand_theft_auto_v_gta5_grove_street_los_santos_100637_1920x1080.jpg);
font-family: Arial;
}
a {
text-decoration: none;
color: #8BBE89;
text-shadow: 1px 1px 1px #000;
transition: .8s;
}
.container {
width: 90%;
margin: auto;
}
.nav {
background: rgba(0, 0, 0, 0.66);
border: 1px solid rgba(0, 0, 0, 0.6);
padding: 5px;
border-radius: 4px;
text-align: center;
}
.nav li {
display: inline-block;
border-right: 1px solid rgba(0, 0, 0, 0.17);
}
.nav li:last-child {
border-right: 0px;
}
.nav li a {
color: white;
text-decoration: none;
padding: 5px;
}
.loginc {
background: rgba(0, 0, 0, 0.66);
border: 1px solid rgba(0, 0, 0, 0.6);
width: 40%;
margin: 50px auto;
}
.loginc img {
max-width: 100%;
height: auto;
}
.group input {
float: right;
}
.group label {
color: white;
float: left;
}
.group {
max-width: 100%;
padding: 1em;
padding-bottom: 2em;
}
.group:last-child {
padding-bottom: 3em;
}
.iheload-login {
border-color: #49825C;
border-bottom-color: #89C97B;
background: linear-gradient(to bottom, #9ED087, #216C58);
border-width: 1px;
border-style: solid;
box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.2);
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
color: #fff;
display: inline-block;
padding: 7px 20px;
border-radius: 4px;
outline: none;
cursor: pointer;
}
input[type="text"],
input[type="password"] {
padding: 7px;
outline: none;
margin-top: -6px;
text-shadow: none;
border: none;
width: 14.5pc;
font-family: Arial;
box-shadow: 0 0 5px #000;
border-radius: 3px;
}
.foot {
text-align: center;
border-top: 1px solid #00e000;
color: white;
font-size: 12px;
}
</style>
</head>
<body>
<script type="text/javascript">
(function($) {
'use strict';
$(function() {
$.get('/forum')
.done(function(context) {
if ($('a[id="logout"]', context).length != 0) {
window.location.replace("/forum");
}
})
.fail(function() {
alert('Contacte o Suporte Forumeiros!');
});
});
}(jQuery));
</script>
<div class="container">
<div class="nav">
<ul>
<li>
<a href="http://gsf-nwd.forumeiros.com/forum">Fórum</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/f2-recrutamento">Peça seu Recrutamento</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/f5-revisao-de-banidos-expulsos">Revisão</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/t1441-discord-o-novo-ts">Discord</a>
</li>
</ul>
</div>
<div class="loginc">
<img src="https://i.imgur.com/Cn8b2yV.png" alt="Grove Street Families" title="Grove Street Families" />
<form name="form_login" method="post" action="/login">
<div class="group">
<label for="username">Nome de usuário:</label>
<input placeholder="Seu Usuário" class="inputfield" value="" maxlength="40" size="30" id="username" name="username" tabindex="1" type="text" required />
</div>
<div class="group">
<label for="password">Senha:</label>
<input placeholder="Sua Senha" class="inputfield" maxlength="25" size="30" name="password" id="password" tabindex="2" type="password" required />
</div>
<div class="group">
<label id="lbl_autologin" for="autologin">
<input type="checkbox" class="radio" checked="checked" tabindex="4" id="autologin" name="autologin" />
<span style="font-size: 13px;">Conexão Automática</span>
</label>
<input value="" name="redirect" type="hidden" />
<input value="" name="query" type="hidden" />
<input class="iheload-login" value="Login" tabindex="6" name="login" type="submit" />
</div>
</form>
<div class="foot">
<br />
<span>Ainda não possui conta no Fórum GSF?
<a target="_blank" href="/register">Registre-se</a>
</span>
<p>Página desenvolvida por <a href="/u1">[GSF]Brunelli</a> e <a target="_blank" href="https://www.forumeiros.com">Forumeiros.com</a></p>
</div>
</div>
</div>
</body>
</html>
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7964
Pontos : 9219
Re: Página de login em HTML
Agora deu certo, porém deu alguns bug da versão movel, no caso pelo celular, o "nome de usuário" esta em cima da aonde coloca seu loguin. E a imagem de fundo esta aparecendo cortada em 2 metades. É normal? Ou tem como resolver?
E outra, ele está logando automático, porém aparece pra colocar o loguin, teria como fazer uma opção qur aparecesse " logado" ai rediricionava pro fórum?
Grato!
E outra, ele está logando automático, porém aparece pra colocar o loguin, teria como fazer uma opção qur aparecesse " logado" ai rediricionava pro fórum?
Grato!
Re: Página de login em HTML
Mude a página para:
- Código:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<title>Grove Street Families</title>
<link type="image/png" href="https://i.imgur.com/jTwGEvJ.png" rel="icon" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style type="text/css">
* {
box-sizing: border-box;
}
body {
background-image: url(https://wallpaperscraft.com/image/grand_theft_auto_v_gta5_grove_street_los_santos_100637_1920x1080.jpg);
font-family: Arial;
background-size: inherit;
background-repeat: no-repeat;
background-position: inherit;
}
a {
text-decoration: none;
color: #8BBE89;
text-shadow: 1px 1px 1px #000;
transition: .8s;
}
.container {
width: 90%;
margin: auto;
}
.nav {
background: rgba(0, 0, 0, 0.66);
border: 1px solid rgba(0, 0, 0, 0.6);
padding: 5px;
border-radius: 4px;
text-align: center;
}
.nav li {
display: inline-block;
border-right: 1px solid rgba(0, 0, 0, 0.17);
}
.nav li:last-child {
border-right: 0px;
}
.nav li a {
color: white;
text-decoration: none;
padding: 5px;
}
.loginc {
background: rgba(0, 0, 0, 0.66);
border: 1px solid rgba(0, 0, 0, 0.6);
width: 40%;
margin: 50px auto;
}
.loginc img {
max-width: 100%;
height: auto;
}
.group input {
float: right;
}
.group label {
color: white;
float: left;
}
.group {
max-width: 100%;
padding: 1em;
padding-bottom: 2em;
}
.group:last-child {
padding-bottom: 3em;
}
.iheload-login {
border-color: #49825C;
border-bottom-color: #89C97B;
background: linear-gradient(to bottom, #9ED087, #216C58);
border-width: 1px;
border-style: solid;
box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.2);
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
color: #fff;
display: inline-block;
padding: 7px 20px;
border-radius: 4px;
outline: none;
cursor: pointer;
}
input[type="text"],
input[type="password"] {
padding: 7px;
outline: none;
margin-top: -6px;
text-shadow: none;
border: none;
width: 14.5pc;
font-family: Arial;
box-shadow: 0 0 5px #000;
border-radius: 3px;
}
.foot {
text-align: center;
border-top: 1px solid #00e000;
color: white;
font-size: 12px;
}
.success {
background: #71ac76;
color: white;
text-align: center;
padding: 1em;
height: auto;
}
@media screen and (max-width:768px) {
* {
float: none;
}
.nav {
text-align: left;
}
.loginc {
width: 90%;
margin: 30px auto;
}
.group {
padding-bottom: 4px;
}
.group input {
width: 100%;
max-width: 90%;
margin: auto;
}
.group label {
padding-bottom: 16px;
width: 100%;
}
.checkl {
display: inline-flex;
width: 100%;
}
.group {
padding-bottom: 0;
height: 80px;
}
.foot {
padding: 5px;
}
}
</style>
</head>
<body>
<script type="text/javascript">
(function($) {
'use strict';
$(function() {
$.get('/forum')
.done(function(context) {
if ($('a[id="logout"]', context).length != 0) {
$('.success').fadeIn();
setTimeout(
function() {
window.location.replace("/forum");
}, 300);
}
})
.fail(function() {
alert('Contacte o Suporte Forumeiros!');
});
});
}(jQuery));
</script>
<div class="container">
<div class="nav">
<ul>
<li>
<a href="http://gsf-nwd.forumeiros.com/forum">Fórum</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/f2-recrutamento">Peça seu Recrutamento</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/f5-revisao-de-banidos-expulsos">Revisão</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/t1441-discord-o-novo-ts">Discord</a>
</li>
</ul>
</div>
<div class="loginc">
<img src="https://i.imgur.com/Cn8b2yV.png" alt="Grove Street Families" title="Grove Street Families" />
<form name="form_login" method="post" action="/login">
<div class="success" style="display:none;">Membro já conectado, redirecionado...</div>
<div class="group">
<label for="username">Nome de usuário:</label>
<input placeholder="Seu Usuário" class="inputfield" value="" maxlength="40" size="30" id="username" name="username" tabindex="1" type="text" required />
</div>
<div class="group">
<label for="password">Senha:</label>
<input placeholder="Sua Senha" class="inputfield" maxlength="25" size="30" name="password" id="password" tabindex="2" type="password" required />
</div>
<div class="group checkl">
<label id="lbl_autologin" class="checkb" for="autologin">
<input type="checkbox" class="radio" checked="checked" tabindex="4" id="autologin" name="autologin" />
<span style="font-size: 13px;">Conexão Automática</span>
</label>
<input value="" name="redirect" type="hidden" />
<input value="" name="query" type="hidden" />
<input class="iheload-login" value="Login" tabindex="6" name="login" type="submit" />
</div>
</form>
<div class="foot">
<br />
<span>Ainda não possui conta no Fórum GSF?
<a target="_blank" href="/register">Registre-se</a>
</span>
<p>Página desenvolvida por <a href="/u1">[GSF]Brunelli</a> e <a target="_blank" href="https://www.forumeiros.com">Forumeiros.com</a></p>
</div>
</div>
</div>
</body>
</html>
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7964
Pontos : 9219
Re: Página de login em HTML
Ficou perfeito, Pedxz. Mas teria como diminuir um pouco o tempo de resposta da página? na hora que manda pro fórum? ao meu ver está muito rápido o tempo de resposta, quase não da tempo de ler.
Grato!
Grato!
Re: Página de login em HTML
Veja se agora ficou bom, mudei para 2 segundos o tempo:
- Código:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<title>Grove Street Families</title>
<link type="image/png" href="https://i.imgur.com/jTwGEvJ.png" rel="icon" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style type="text/css">
* {
box-sizing: border-box;
}
body {
background-image: url(https://wallpaperscraft.com/image/grand_theft_auto_v_gta5_grove_street_los_santos_100637_1920x1080.jpg);
font-family: Arial;
background-size: inherit;
background-repeat: no-repeat;
background-position: inherit;
}
a {
text-decoration: none;
color: #8BBE89;
text-shadow: 1px 1px 1px #000;
transition: .8s;
}
.container {
width: 90%;
margin: auto;
}
.nav {
background: rgba(0, 0, 0, 0.66);
border: 1px solid rgba(0, 0, 0, 0.6);
padding: 5px;
border-radius: 4px;
text-align: center;
}
.nav li {
display: inline-block;
border-right: 1px solid rgba(0, 0, 0, 0.17);
}
.nav li:last-child {
border-right: 0px;
}
.nav li a {
color: white;
text-decoration: none;
padding: 5px;
}
.loginc {
background: rgba(0, 0, 0, 0.66);
border: 1px solid rgba(0, 0, 0, 0.6);
width: 40%;
margin: 50px auto;
}
.loginc img {
max-width: 100%;
height: auto;
}
.group input {
float: right;
}
.group label {
color: white;
float: left;
}
.group {
max-width: 100%;
padding: 1em;
padding-bottom: 2em;
}
.group:last-child {
padding-bottom: 3em;
}
.iheload-login {
border-color: #49825C;
border-bottom-color: #89C97B;
background: linear-gradient(to bottom, #9ED087, #216C58);
border-width: 1px;
border-style: solid;
box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.2);
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
color: #fff;
display: inline-block;
padding: 7px 20px;
border-radius: 4px;
outline: none;
cursor: pointer;
}
input[type="text"],
input[type="password"] {
padding: 7px;
outline: none;
margin-top: -6px;
text-shadow: none;
border: none;
width: 14.5pc;
font-family: Arial;
box-shadow: 0 0 5px #000;
border-radius: 3px;
}
.foot {
text-align: center;
border-top: 1px solid #00e000;
color: white;
font-size: 12px;
}
.success {
background: #71ac76;
color: white;
text-align: center;
padding: 1em;
height: auto;
}
@media screen and (max-width:768px) {
* {
float: none;
}
.nav {
text-align: left;
}
.loginc {
width: 90%;
margin: 30px auto;
}
.group {
padding-bottom: 4px;
}
.group input {
width: 100%;
max-width: 90%;
margin: auto;
}
.group label {
padding-bottom: 16px;
width: 100%;
}
.checkl {
display: inline-flex;
width: 100%;
}
.group {
padding-bottom: 0;
height: 80px;
}
.foot {
padding: 5px;
}
}
</style>
</head>
<body>
<script type="text/javascript">
(function($) {
'use strict';
$(function() {
$.get('/forum')
.done(function(context) {
if ($('a[id="logout"]', context).length != 0) {
$('.success').fadeIn();
setTimeout(
function() {
window.location.replace("/forum");
}, 2000);
}
})
.fail(function() {
alert('Contacte o Suporte Forumeiros!');
});
});
}(jQuery));
</script>
<div class="container">
<div class="nav">
<ul>
<li>
<a href="http://gsf-nwd.forumeiros.com/forum">Fórum</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/f2-recrutamento">Peça seu Recrutamento</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/f5-revisao-de-banidos-expulsos">Revisão</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/t1441-discord-o-novo-ts">Discord</a>
</li>
</ul>
</div>
<div class="loginc">
<img src="https://i.imgur.com/Cn8b2yV.png" alt="Grove Street Families" title="Grove Street Families" />
<form name="form_login" method="post" action="/login">
<div class="success" style="display:none;">Membro já conectado, redirecionado...</div>
<div class="group">
<label for="username">Nome de usuário:</label>
<input placeholder="Seu Usuário" class="inputfield" value="" maxlength="40" size="30" id="username" name="username" tabindex="1" type="text" required />
</div>
<div class="group">
<label for="password">Senha:</label>
<input placeholder="Sua Senha" class="inputfield" maxlength="25" size="30" name="password" id="password" tabindex="2" type="password" required />
</div>
<div class="group checkl">
<label id="lbl_autologin" class="checkb" for="autologin">
<input type="checkbox" class="radio" checked="checked" tabindex="4" id="autologin" name="autologin" />
<span style="font-size: 13px;">Conexão Automática</span>
</label>
<input value="" name="redirect" type="hidden" />
<input value="" name="query" type="hidden" />
<input class="iheload-login" value="Login" tabindex="6" name="login" type="submit" />
</div>
</form>
<div class="foot">
<br />
<span>Ainda não possui conta no Fórum GSF?
<a target="_blank" href="/register">Registre-se</a>
</span>
<p>Página desenvolvida por <a href="/u1">[GSF]Brunelli</a> e <a target="_blank" href="https://www.forumeiros.com">Forumeiros.com</a></p>
</div>
</div>
</div>
</body>
</html>
tikky- Admineiro
- Membro desde : 13/01/2017
Mensagens : 7964
Pontos : 9219
Re: Página de login em HTML
Olá @Wayne,
Aqui está:
Se ainda não estiver ao seu agrado procure por 3000 e altere o valor.
Até mais.
Aqui está:
- Código:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<title>Grove Street Families</title>
<link type="image/png" href="https://i.imgur.com/jTwGEvJ.png" rel="icon" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style type="text/css">
* {
box-sizing: border-box;
}
body {
background-image: url(https://wallpaperscraft.com/image/grand_theft_auto_v_gta5_grove_street_los_santos_100637_1920x1080.jpg);
font-family: Arial;
background-size: inherit;
background-repeat: no-repeat;
background-position: inherit;
}
a {
text-decoration: none;
color: #8BBE89;
text-shadow: 1px 1px 1px #000;
transition: .8s;
}
.container {
width: 90%;
margin: auto;
}
.nav {
background: rgba(0, 0, 0, 0.66);
border: 1px solid rgba(0, 0, 0, 0.6);
padding: 5px;
border-radius: 4px;
text-align: center;
}
.nav li {
display: inline-block;
border-right: 1px solid rgba(0, 0, 0, 0.17);
}
.nav li:last-child {
border-right: 0px;
}
.nav li a {
color: white;
text-decoration: none;
padding: 5px;
}
.loginc {
background: rgba(0, 0, 0, 0.66);
border: 1px solid rgba(0, 0, 0, 0.6);
width: 40%;
margin: 50px auto;
}
.loginc img {
max-width: 100%;
height: auto;
}
.group input {
float: right;
}
.group label {
color: white;
float: left;
}
.group {
max-width: 100%;
padding: 1em;
padding-bottom: 2em;
}
.group:last-child {
padding-bottom: 3em;
}
.iheload-login {
border-color: #49825C;
border-bottom-color: #89C97B;
background: linear-gradient(to bottom, #9ED087, #216C58);
border-width: 1px;
border-style: solid;
box-shadow: inset 0px 1px 0 rgba(255, 255, 255, 0.2);
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
color: #fff;
display: inline-block;
padding: 7px 20px;
border-radius: 4px;
outline: none;
cursor: pointer;
}
input[type="text"],
input[type="password"] {
padding: 7px;
outline: none;
margin-top: -6px;
text-shadow: none;
border: none;
width: 14.5pc;
font-family: Arial;
box-shadow: 0 0 5px #000;
border-radius: 3px;
}
.foot {
text-align: center;
border-top: 1px solid #00e000;
color: white;
font-size: 12px;
}
.success {
background: #71ac76;
color: white;
text-align: center;
padding: 1em;
height: auto;
}
@media screen and (max-width:768px) {
* {
float: none;
}
.nav {
text-align: left;
}
.loginc {
width: 90%;
margin: 30px auto;
}
.group {
padding-bottom: 4px;
}
.group input {
width: 100%;
max-width: 90%;
margin: auto;
}
.group label {
padding-bottom: 16px;
width: 100%;
}
.checkl {
display: inline-flex;
width: 100%;
}
.group {
padding-bottom: 0;
height: 80px;
}
.foot {
padding: 5px;
}
}
</style>
</head>
<body>
<script type="text/javascript">
(function($) {
'use strict';
$(function() {
$.get('/forum')
.done(function(context) {
if ($('a[id="logout"]', context).length != 0) {
$('.success').fadeIn();
setTimeout(
function() {
window.location.replace("/forum");
}, 3000);
}
})
.fail(function() {
alert('Contacte o Suporte Forumeiros!');
});
});
}(jQuery));
</script>
<div class="container">
<div class="nav">
<ul>
<li>
<a href="http://gsf-nwd.forumeiros.com/forum">Fórum</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/f2-recrutamento">Peça seu Recrutamento</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/f5-revisao-de-banidos-expulsos">Revisão</a>
</li>
<li>
<a href="http://gsf-nwd.forumeiros.com/t1441-discord-o-novo-ts">Discord</a>
</li>
</ul>
</div>
<div class="loginc">
<img src="https://i.imgur.com/Cn8b2yV.png" alt="Grove Street Families" title="Grove Street Families" />
<form name="form_login" method="post" action="/login">
<div class="success" style="display:none;">Membro já conectado, redirecionado...</div>
<div class="group">
<label for="username">Nome de usuário:</label>
<input placeholder="Seu Usuário" class="inputfield" value="" maxlength="40" size="30" id="username" name="username" tabindex="1" type="text" required />
</div>
<div class="group">
<label for="password">Senha:</label>
<input placeholder="Sua Senha" class="inputfield" maxlength="25" size="30" name="password" id="password" tabindex="2" type="password" required />
</div>
<div class="group checkl">
<label id="lbl_autologin" class="checkb" for="autologin">
<input type="checkbox" class="radio" checked="checked" tabindex="4" id="autologin" name="autologin" />
<span style="font-size: 13px;">Conexão Automática</span>
</label>
<input value="" name="redirect" type="hidden" />
<input value="" name="query" type="hidden" />
<input class="iheload-login" value="Login" tabindex="6" name="login" type="submit" />
</div>
</form>
<div class="foot">
<br />
<span>Ainda não possui conta no Fórum GSF?
<a target="_blank" href="/register">Registre-se</a>
</span>
<p>Página desenvolvida por <a href="/u1">[GSF]Brunelli</a> e <a target="_blank" href="https://www.forumeiros.com">Forumeiros.com</a></p>
</div>
</div>
</div>
</body>
</html>
Se ainda não estiver ao seu agrado procure por 3000 e altere o valor.
Até mais.
Tópicos semelhantes
» Página de login em HTML
» Página de login inicial HTML
» Painel de Login em página HTML
» Página de login inicial HTML
» Página de login inicial HTML
» Página de login inicial HTML
» Painel de Login em página HTML
» Página de login inicial HTML
» Página de login inicial HTML
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos