Rpg Maker BRasil
RPG Maker Brasil - RMBR

Seja Bem vindo ao Forúm! Faça seu cadastro e desfrute sobre o mundo do RPG Maker!
P.S.: PARA MELHOR VIZUALIZAÇÃO DO FORUM SEM BUGS, RECOMENDO QUE USEM O MOZILLA FIREFOX OU O GOOGLE CHROME!
Rpg Maker BRasil

Evoluindo cada vez mais!


Você não está conectado. Conecte-se ou registre-se

Ver o tópico anterior Ver o tópico seguinte Ir em baixo  Mensagem [Página 1 de 1]

HenRyqUéè

avatar
Administrador
Avaliador
Helper

[Você precisa estar registrado e conectado para ver esta imagem.]

[TUTORIAL] Página HTML mediana por DexTer

Olá pessoal, eu tava sem internet desde domingo até ontem, então pra nao ficar só desenhando no paint, eu resolvi fazer uma página html no dreamweaver, ela contem um menu, um logo e uma caixa para boas vindas, noticias, informações, etc....

[Você precisa estar registrado e conectado para ver esta imagem.]ATENÇÃO!!!
Está página foi criada inteiramente por dexTer e os créditos são para: [Você precisa estar registrado e conectado para ver este link.]. Se fazerem cópias, por favor não retirar esta caixa!
--> Tutoriais, dicas e astúcias <--
[TUTORIAL] Página HTML V³ por DexTer



- Código HTML
Aceda a:
Módulos > HTML e Javascript > Gestão da Páginas HTML >> Nova página
Título: Dê um título para a página.
Você deseja utilizar o início e o final da página do seu fórum?: Marque NÂO.
Usar esta página como página inicial?: Marque SIM.
Código HTML: Cole o seguinte código abaixo:

CLIQUE PARA ABRIR:
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
.menu{
box-shadow: 0px 0px 5px grey;
border-radius:10px;
-moz-border-radius:10px;
-webkit-moz-border-radius:10px;
width:65%;
padding:9px;
background:#333333;
}
.menu a{
transition:all linear 0.5s;
-moz-transition:all linear 0.5s;
-webkit-moz-trasition:all linear 0.5s;
font-weight:bold;
text-shadow:0px 0px 1px grey;
color:#999999;
margin-right:35px;
text-decoration:none;
}
.menu a:hover{
border-radius:5px;
box-shadow:0px 0px 1px black;
border-bottom:3px #000000;
transition:all linear 0.5s;
-moz-transition:all linear 0.5s;
-webkit-moz-trasition:all linear 0.5s;
padding:12px;
color:black;
text-shadow:#333333;
background:#666666;
}
.menu a:active{
background:#000000;
color:#999999;
}
#tabela1{
display:table;
background:#999999;
width:70%; height:500px;; float:center; border:1px solid black;
margin-top:25px;
border-radius:20px;
box-shadow:2px 3px 15px grey;
}
#tabela1 a{
text-decoration:none;
color:#999999;
}
body{
background:#CCCCCC;
}
</style>

<link rel="shortcut icon" type="image/x-icon" href="http://dl.dropbox.com/u/19426320/Swords.png" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Página do Tutorial</title>
</head>
<body>
<center><img src="http://i36.servimg.com/u/f36/16/96/02/41/tutori10.png" style="height:200px; width:800px;"/></center>
<center><div class="menu"><a href="/forum">FORÚM</a><a href="/groups">GRUPOS</a><a href="/memberlist">MEMBROS</a><a href="/faq">FAQ</a></div>
<table id="tabela1">
<td><center><div style="box-shadow:0px 0px 3px #333333; border-radius:5px; background:#CCCCCC; margin-bottom:10px;border:1px solid black; width:90%; height:380px"><center>AQUI VOCÊ COLOCARÁ QUALQUER INFORMAÇÕES SOBRE SEU FORUM, COMO UMA MENSAGEM DE BOAS-VINDAS</center>
</div>
<div style="position:inherit; border-radius:5px; margin-bottom:-5px; margin-top:15px; box-shadow:0px 0px 5px black; background:#333333; color:#CCCCCC; border:1px solid black; padding:10px; width:350px;">PÁGINA CRIADA POR HENRIQUE<br />
<a target="_blank" href="www.rmbr.forumeiros.com">www.rmbr.forumeiros.com</a>
</div></center>
</table></center>
<h6 style="text-align:center; font-size:9px;" >HOSPEDADO POR: <a style="text-decoration:none; color:#333333;" href="www.forumeiros.com" target="_blank">FORUMEIROS</a></h6>
</body>
</html>

Alterando os textos da caixa e os links do menu:
CLIQUE PARA ABRIR:
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
.menu{
box-shadow: 0px 0px 5px grey;
border-radius:10px;
-moz-border-radius:10px;
-webkit-moz-border-radius:10px;
width:65%;
padding:9px;
background:#333333;
}
.menu a{
transition:all linear 0.5s;
-moz-transition:all linear 0.5s;
-webkit-moz-trasition:all linear 0.5s;
font-weight:bold;
text-shadow:0px 0px 1px grey;
color:#999999;
margin-right:35px;
text-decoration:none;
}
.menu a:hover{
border-radius:5px;
box-shadow:0px 0px 1px black;
border-bottom:3px #000000;
transition:all linear 0.5s;
-moz-transition:all linear 0.5s;
-webkit-moz-trasition:all linear 0.5s;
padding:12px;
color:black;
text-shadow:#333333;
background:#666666;
}
.menu a:active{
background:#000000;
color:#999999;
}
#tabela1{
display:table;
background:#999999;
width:70%; height:500px;; float:center; border:1px solid black;
margin-top:25px;
border-radius:20px;
box-shadow:2px 3px 15px grey;
}
#tabela1 a{
text-decoration:none;
color:#999999;
}
body{
background:#CCCCCC;
}
</style>

<link rel="shortcut icon" type="image/x-icon" href="<b>ícone da página</b>" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title><b>TÍTULO DA PÁGINA</b></title>
</head>
<body>
<center><img src="<b>LOGO DA PÁGINA</b>" style="height:200px; width:800px;"/></center>
<center><div class="menu"><a href="<b>Link do menu</b>"><b>MENU</b></a><a href="<b>Link do menu</b>"><b>MENU</b></a><a href="<b>Link do menu</b>"><b>MENU</b></a><a href="<b>Link do menu</b>"><b>MENU</b></a></div>
<table id="tabela1">
<td><center><div style="box-shadow:0px 0px 3px #333333; border-radius:5px; background:#CCCCCC; margin-bottom:10px;border:1px solid black; width:90%; height:380px"><center><b>AQUI VOCÊ COLOCARÁ QUALQUER INFORMAÇÕES SOBRE SEU FORUM, COMO UMA MENSAGEM DE BOAS-VINDAS</b></center>
</div>
<div style="position:inherit; border-radius:5px; margin-bottom:-5px; margin-top:15px; box-shadow:0px 0px 5px black; background:#333333; color:#CCCCCC; border:1px solid black; padding:10px; width:350px;">PÁGINA CRIADA POR HENRIQUE<br />
<a target="_blank" href="www.rmbr.forumeiros.com">www.rmbr.forumeiros.com</a>
</div></center>
</table></center>
<h6 style="text-align:center; font-size:9px;" >HOSPEDADO POR: <a style="text-decoration:none; color:#333333;" href="www.forumeiros.com" target="_blank">FORUMEIROS</a></h6>
</body>
</html>
SALVE!

- Resultado final
Se você deixou o código como eu passei, ele ficará assim: [Você precisa estar registrado e conectado para ver este link.]


  • Funciona em quai versões?
    Todas, pois trata-se de um código HTML e não uma classe css específica do forum.





© RMBR


[Você precisa estar registrado e conectado para ver esta imagem.] Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[TUTORIAL] Página HTML mediana por DexTer

http://rmbr.forumeiros.com/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo  Mensagem [Página 1 de 1]

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum