Colocar botão de menu em página HTML

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 09/05/15, 02:36 pm

Olá!

Eu estou a tentar realizar uma página em HTML, então fica aqui o código:
Código:
<head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet"></head>
 
<div id="header-wrapper">
   <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div>


<style>
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }
</style>

Queria colocar à frente da logo um botão ou seja queria um botão como está no footer deste fórum: http://www.lifegrounds.biz/ a dizer "Soporto 100%..." se possível realizar tal agradecia! Muito feliz

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Sennior em 09/05/15, 02:55 pm

Saudações,

Cá estar amigo:
Código:
<head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet"></head>
 
<div id="header-wrapper">
  <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div><div class="bloqvip"><a href="#" target="_blank"><div class="tibq">Soporte <strong>100%</strong></div>Gratuito</a></div>


<style>
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }.bloqvip {
  background: #71A200;
  margin-left: 81%;
  text-align: center;
  padding: 8px;
  position: relative;
  left: -24pc;
  top: 25px;
  box-shadow: 0px 5px 8px 0px rgba(93, 93, 93, 0.17) inset;
  -webkit-transition: 0.3s;
  -moz-transition-duration: 0.3s;
  -htm-transition-duration: 0.3s;
  border-radius: 7px;
}
.bloqvip:hover {
  transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}
.tibq {
  font-size: 20px;
  font-family: verdana;
  font-style: normal;
  font-weight: bold;
  color: white;
}
a:link {
  color: #FAFAFA;
}.pun .anuncbloq a {
  color: white;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.26);
  display: block;
  padding: 10px;
  font: italic 15px arial;
}
  border-radius: 5px;
</style>

Abraços.
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 09/05/15, 02:57 pm

Olá!

Poderia dizer onde poderia colocar mais para a direita o botão? Muito feliz

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Sennior em 09/05/15, 03:04 pm

Assim?
Código:
<head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet"></head>
 
<div id="header-wrapper">
  <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div><div class="bloqvip"><a href="#" target="_blank"><div class="tibq">Soporte <strong>100%</strong></div>Gratuito</a></div>


<style>
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }.bloqvip {
  background: #71A200;
  margin-left: 75%;
  text-align: center;
  padding: 8px;
  position: relative;
  left: -7pc;
  top: 25px;
  box-shadow: 0px 5px 8px 0px rgba(93, 93, 93, 0.17) inset;
  -webkit-transition: 0.3s;
  -moz-transition-duration: 0.3s;
  -htm-transition-duration: 0.3s;
  border-radius: 5px;
}
.bloqvip:hover {
  transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}
.tibq {
  font-size: 20px;
  font-family: verdana;
  font-style: normal;
  font-weight: bold;
  color: white;
}
a:link {
  color: #FAFAFA;
}.pun .anuncbloq a {
  color: white;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.26);
  display: block;
  padding: 10px;
  font: italic 15px arial;
}
  border-radius: 5px;
</style>

Até mais.
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 09/05/15, 03:07 pm

Olá!

Isso mesmo se não for incómodo, será possível colocar à frente 2 botões para Facebook e Twiiter, como aqui:
- http://www.forumeiros.com/condicoes-gerais

A realizar o efeito hover se possível também :/

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 04:39 am

UP!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Lima 3005 em 11/05/15, 12:03 pm

Boa tarde, penso que seja isto!

Código:
<html><head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet"><style type="text/css"></style></head>
 
<body><div id="header-wrapper">
  <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div><div class="bloqvip"><a href="#" target="_blank"><div class="tibq">Soporte <strong>100%</strong></div>Gratuito</a></div>


<div class="social">
  <a href=""><i class="fa fa-facebook"></i></a>


<a href=""><i class="fa fa-twitter"></i></a>
 
  </div>
<style>i.fa.fa-twitter:hover {
  color: rgb(85, 172, 238);
  cursor: pointer;
}
i.fa.fa-facebook:hover {
  background: rgb(58, 87, 149);
  cursor: pointer;
}
i.fa.fa-facebook, i.fa.fa-twitter {
  font-size: 20px;
  color: white;
  position: relative;
  float: right;
  margin-top: -20px;
  padding: 10px;
  transition: 1s;
}
  .fa-facebook-f:before, .fa-facebook:before {
  content: "\f09a";
}
.fa-twitter:before {
  content: "\f099";
}
  .fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }.bloqvip {
  background: #71A200;
  margin-left: 75%;
  text-align: center;
  padding: 8px;
  position: relative;
  left: -7pc;
  top: 25px;
  box-shadow: 0px 5px 8px 0px rgba(93, 93, 93, 0.17) inset;
  -webkit-transition: 0.3s;
  -moz-transition-duration: 0.3s;
  -htm-transition-duration: 0.3s;
  border-radius: 5px;
}
.bloqvip:hover {
  transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}
.tibq {
  font-size: 20px;
  font-family: verdana;
  font-style: normal;
  font-weight: bold;
  color: white;
}
a:link {
  color: #FAFAFA;
}.pun .anuncbloq a {
  color: white;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.26);
  display: block;
  padding: 10px;
  font: italic 15px arial;
}
  border-radius: 5px;
</style>
    </div></div></body></html>
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 02:32 pm

Olá!

Vou modificar antes é algo como isso, mas poderá modificar aquele botão verde mais as redes sociais e colocar como este:
- http://www.forumeiros.com/condicoes-gerais

O botão de "Suporte" e as redes sociais?

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Lima 3005 em 11/05/15, 02:37 pm

Não percebi :o
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 03:03 pm

Olá!

Basicamente queria colocar os botões de topo na minha página HTML:

- Fórum
- Facebook
- Twitter

Queria desse jeito: http://www.forumeiros.com/condicoes-gerais, mas queria os das redes sociais com o tal efeito hover se possível, percebeu amigo?

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Lima 3005 em 11/05/15, 03:10 pm

E como lhe enviei não está?
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 03:20 pm

Olá!

Queria era agora um botão a dizer "Fórum" percebeu? E o efeito de hover não me agradou muito veja amigo:
- http://suportedesign.forumeiros.com/h11-test

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Lima 3005 em 11/05/15, 03:21 pm

Quer o botão a dizer fórum onde?
Como quer o efeito hover? Não dá para fazer ao que enviou porque o fundo já é preto!
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 03:51 pm

Olá!

O botão a dizer fórum queria ao lado esquerdo ou seja, retirar aquele em verde grande e colocar um a dizer "Fórum".

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Lima 3005 em 11/05/15, 04:12 pm

Isto que deseja amigo?

Código:
<html><head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet"><style type="text/css"></style><style type="text/css"></style></head>
 
<body><div id="header-wrapper">
  <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div><div class="bloqvip"><a href="#" target="_blank"><div class="tibq">Fórum</div></a></div>


<div class="social">
  <a href=""><i class="fa fa-facebook"></i></a>


<a href=""><i class="fa fa-twitter"></i></a>
 
  </div>
<style>.social {
  position: relative;
  margin-top: 60px;
}

i.fa.fa-twitter:hover {
  color: rgb(85, 172, 238);
  cursor: pointer;
}
i.fa.fa-facebook:hover {
  background: rgb(58, 87, 149);
  cursor: pointer;
}
i.fa.fa-facebook, i.fa.fa-twitter {
  font-size: 20px;
  color: white;
  position: relative;
  float: right;
  margin-top: -20px;
  padding: 10px;
  transition: 1s;
}
  .fa-facebook-f:before, .fa-facebook:before {
  content: "\f09a";
}
.fa-twitter:before {
  content: "\f099";
}
  .fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }
.bloqvip {
  background: #71A200;
  text-align: center;
  padding: 8px;
  position: absolute;
  top: 35px;
  box-shadow: 0px 5px 8px 0px rgba(93, 93, 93, 0.17) inset;
  -webkit-transition: 0.3s;
  -moz-transition-duration: 0.3s;
  -htm-transition-duration: 0.3s;
  border-radius: 5px;
  margin-left: -140px;
}
.bloqvip:hover {
  transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}
.tibq {
  font-size: 20px;
  font-family: verdana;
  font-style: normal;
  font-weight: bold;
  color: white;
}
a:link {
  color: #FAFAFA;
}.pun .anuncbloq a {
  color: white;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.26);
  display: block;
  padding: 10px;
  font: italic 15px arial;
}
  border-radius: 5px;
</style>
    </div></div></body></html>
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 04:17 pm

Olá!

Seria possível colocar o botão no lado direito antes? Ao lado das redes sociais?

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Lima 3005 em 11/05/15, 04:20 pm

Assim?

Código:
<html><head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet"><style type="text/css"></style><style type="text/css"></style></head>
 
<body><div id="header-wrapper">
  <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div><div class="bloqvip"><a href="#" target="_blank"><div class="tibq">Fórum</div></a></div>


<div class="social">
  <a href=""><i class="fa fa-facebook"></i></a>


<a href=""><i class="fa fa-twitter"></i></a>
 
  </div>
<style>.social {
  position: relative;
  margin-top: 60px;
}

i.fa.fa-twitter:hover {
  color: rgb(85, 172, 238);
  cursor: pointer;
}
i.fa.fa-facebook:hover {
  background: rgb(58, 87, 149);
  cursor: pointer;
}
i.fa.fa-facebook, i.fa.fa-twitter {
  font-size: 20px;
  color: white;
  position: relative;
  float: right;
  margin-top: -20px;
  padding: 10px;
  transition: 1s;
}
  .fa-facebook-f:before, .fa-facebook:before {
  content: "\f09a";
}
.fa-twitter:before {
  content: "\f099";
}
  .fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }
.bloqvip {
  background: #71A200;
  text-align: center;
  padding: 8px;
  position: relative;
  top: 35px;
  box-shadow: 0px 5px 8px 0px rgba(93, 93, 93, 0.17) inset;
  -webkit-transition: 0.3s;
  -moz-transition-duration: 0.3s;
  -htm-transition-duration: 0.3s;
  border-radius: 5px;
  float: right;
  left: 130px;
}
.bloqvip:hover {
  transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}
.tibq {
  font-size: 20px;
  font-family: verdana;
  font-style: normal;
  font-weight: bold;
  color: white;
}
a:link {
  color: #FAFAFA;
}.pun .anuncbloq a {
  color: white;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.26);
  display: block;
  padding: 10px;
  font: italic 15px arial;
}
  border-radius: 5px;
</style>
    </div></div>
</body></html>
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 04:26 pm

Olá!

Isso mesmo, será que o efeito hover do facebook em vez de aparecer o fundo em azul, aparecer antes o "F" ?

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Lima 3005 em 11/05/15, 04:27 pm

Assim?

Código:
<html><head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet"><style type="text/css"></style><style type="text/css"></style></head>
 
<body><div id="header-wrapper">
  <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div><div class="bloqvip"><a href="#" target="_blank"><div class="tibq">Fórum</div></a></div>


<div class="social">
  <a href=""><i class="fa fa-facebook"></i></a>


<a href=""><i class="fa fa-twitter"></i></a>
 
  </div>
<style>.social {
  position: relative;
  margin-top: 60px;
}

i.fa.fa-twitter:hover {
  color: rgb(85, 172, 238);
  cursor: pointer;
}
i.fa.fa-facebook:hover {
  color: rgb(58, 87, 149);
  cursor: pointer;
}
i.fa.fa-facebook, i.fa.fa-twitter {
  font-size: 20px;
  color: white;
  position: relative;
  float: right;
  margin-top: -20px;
  padding: 10px;
  transition: 1s;
}
  .fa-facebook-f:before, .fa-facebook:before {
  content: "\f09a";
}
.fa-twitter:before {
  content: "\f099";
}
  .fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }
.bloqvip {
  background: #71A200;
  text-align: center;
  padding: 8px;
  position: relative;
  top: 35px;
  box-shadow: 0px 5px 8px 0px rgba(93, 93, 93, 0.17) inset;
  -webkit-transition: 0.3s;
  -moz-transition-duration: 0.3s;
  -htm-transition-duration: 0.3s;
  border-radius: 5px;
  float: right;
  left: 130px;
}
.bloqvip:hover {
  transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}
.tibq {
  font-size: 20px;
  font-family: verdana;
  font-style: normal;
  font-weight: bold;
  color: white;
}
a:link {
  color: #FAFAFA;
}.pun .anuncbloq a {
  color: white;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.26);
  display: block;
  padding: 10px;
  font: italic 15px arial;
}
  border-radius: 5px;
</style>
    </div></div>
</body></html>
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 04:36 pm

Olá!

Perfeito amigo, agora queria mais ajudas, como por exemplo queria colocar texto por aí abaixo algo como isto:
- http://www.forumeiros.com/condicoes-gerais

Será que me poderia colocar tudo direito e um texto como exemplo?

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Lima 3005 em 11/05/15, 04:41 pm

Isto?

Código:
<html><head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet"><style type="text/css"></style><style type="text/css"></style><style type="text/css"></style></head>
 
<body><div id="header-wrapper">
  <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div><div class="bloqvip"><a href="#" target="_blank"><div class="tibq">Fórum</div></a></div>


<div class="social">
  <a href=""><i class="fa fa-facebook"></i></a>


<a href=""><i class="fa fa-twitter"></i></a>
 
  </div>
<style>
  .conteudo {
  text-align: justify;
  font-size: 15px;
  padding: 20px;
}
  .social {
  position: relative;
  margin-top: 60px;
}

i.fa.fa-twitter:hover {
  color: rgb(85, 172, 238);
  cursor: pointer;
}
i.fa.fa-facebook:hover {
  color: rgb(58, 87, 149);
  cursor: pointer;
}
i.fa.fa-facebook, i.fa.fa-twitter {
  font-size: 20px;
  color: white;
  position: relative;
  float: right;
  margin-top: -20px;
  padding: 10px;
  transition: 1s;
}
  .fa-facebook-f:before, .fa-facebook:before {
  content: "\f09a";
}
.fa-twitter:before {
  content: "\f099";
}
  .fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }
.bloqvip {
  background: #71A200;
  text-align: center;
  padding: 8px;
  position: relative;
  top: 35px;
  box-shadow: 0px 5px 8px 0px rgba(93, 93, 93, 0.17) inset;
  -webkit-transition: 0.3s;
  -moz-transition-duration: 0.3s;
  -htm-transition-duration: 0.3s;
  border-radius: 5px;
  float: right;
  left: 130px;
}
.bloqvip:hover {
  transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}
.tibq {
  font-size: 20px;
  font-family: verdana;
  font-style: normal;
  font-weight: bold;
  color: white;
}
a:link {
  color: #FAFAFA;
}.pun .anuncbloq a {
  color: white;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.26);
  display: block;
  padding: 10px;
  font: italic 15px arial;
}
  border-radius: 5px;
</style>
    </div></div>
  <div class="conteudo">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque neque enim, varius ac venenatis lobortis, pharetra id dui. Nunc pellentesque sapien eu libero volutpat feugiat. Integer suscipit nunc diam. Morbi tincidunt eu risus in ultrices. Etiam risus est, commodo id massa eu, venenatis luctus felis. Nullam in feugiat nulla. Sed mauris arcu, vehicula ut ornare quis, vestibulum ut libero. Vivamus vel faucibus nisi. Nunc dignissim elementum fermentum. Phasellus ut neque leo. Maecenas viverra sed turpis sit amet sollicitudin. Fusce rhoncus eget diam non fermentum. Proin placerat, magna in iaculis lobortis, metus est auctor nisl, in tristique urna magna ac turpis.

Morbi tellus metus, finibus a euismod eu, dignissim eu nulla. Nam eu pretium ex. Cras viverra sit amet felis vitae luctus. Morbi semper a risus at hendrerit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec elit urna, bibendum efficitur enim at, posuere congue ligula. Fusce malesuada lacus non arcu placerat eleifend. Suspendisse urna felis, tincidunt in dapibus sit amet, scelerisque sed ex. Nulla mattis mi eu dolor consectetur euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus.

Suspendisse semper finibus magna vitae vehicula. Proin venenatis, lorem nec luctus luctus, quam dolor fermentum enim, sit amet congue leo sapien sed sem. Maecenas dictum purus sem, ut ullamcorper dui auctor a. Nulla facilisi. Cras lobortis rutrum orci, non luctus orci iaculis sagittis. Mauris massa massa, pharetra eu placerat vitae, mollis ut massa. Suspendisse eget magna eu nisi volutpat tincidunt at vel ligula. Sed a lacinia leo. Sed sed ipsum a massa ultricies tempus. In consectetur pharetra mi, vel fermentum arcu posuere sit amet. Vestibulum arcu dui, venenatis at nunc eget, rhoncus scelerisque dolor. Nullam feugiat turpis nec ornare rutrum.

Aenean molestie, eros id facilisis hendrerit, quam lorem placerat sem, in mollis tellus lorem nec odio. Curabitur at interdum odio. Proin tempus diam aliquam odio suscipit faucibus. Ut sed felis eget quam scelerisque volutpat id aliquet ex. Cras maximus id sapien nec accumsan. Suspendisse interdum aliquam sagittis. Aliquam commodo mollis quam, et auctor risus dapibus et. Quisque eget enim interdum, mollis arcu volutpat, rutrum arcu. Suspendisse laoreet dolor id tellus molestie fermentum at quis est. Proin posuere bibendum imperdiet. Donec ultrices ligula id quam vulputate hendrerit.

Curabitur tincidunt non libero a blandit. Curabitur non arcu neque. Cras vel porttitor erat, sit amet tristique libero. Duis posuere a tellus sed ultrices. Phasellus consequat, lorem aliquam suscipit auctor, lectus nunc fermentum arcu, ac volutpat nisl dolor vitae nibh. Curabitur lacinia ipsum quis tortor suscipit malesuada. In quis dolor egestas, sollicitudin tortor quis, egestas nisl. Sed quis dapibus dolor, vitae volutpat eros. Vivamus tortor felis, molestie nec felis eu, tincidunt eleifend enim. Phasellus eu sapien quis lectus finibus volutpat non vitae nibh. Vivamus hendrerit consectetur odio ultrices consectetur. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris volutpat vitae velit congue eleifend. Cras dolor erat, iaculis nec dignissim sit amet, aliquet non augue.

Quisque commodo varius urna, non convallis lectus interdum ut. Duis vel nulla enim. Fusce dolor nibh, ullamcorper non felis sit amet, condimentum sagittis eros. Sed nec tempor augue. Suspendisse potenti. Nunc nec tempor lacus, et mollis enim. Nullam velit erat, pretium ac elit ac, fringilla blandit velit.

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce nec lacus in arcu aliquam ultricies et a mi. Vestibulum pellentesque, est ac sollicitudin maximus, purus enim finibus dolor, eget dictum metus eros et arcu. Mauris vel dui dictum justo ultrices vestibulum eget eget turpis. Vestibulum malesuada sem libero, nec vestibulum libero ornare id. Suspendisse pulvinar ultricies elit in pellentesque. Nam vestibulum, tellus a tincidunt viverra, lorem felis convallis diam, quis egestas nunc magna non enim. Nulla sit amet porta nisi. Donec vel semper dolor.

Phasellus tempus risus et egestas condimentum. Aliquam a dignissim orci, quis ultricies ex. Donec congue mattis tortor, in vestibulum enim dignissim a. Nunc nibh lectus, egestas ac suscipit non, tempor id quam. Duis sed justo ut nibh porttitor dapibus. Cras mauris leo, pharetra ut sapien ut, imperdiet tristique ex. Nam nec nisl eu urna tempor luctus. Vivamus aliquam diam eget auctor mattis. Maecenas feugiat ligula sed est cursus accumsan. Praesent massa augue, condimentum nec tincidunt sed, suscipit at libero. Nulla non arcu massa. Nunc risus tortor, consectetur id tincidunt quis, lacinia sed dui. Pellentesque laoreet sapien eu sem porttitor tristique.

Etiam elementum ex neque, scelerisque bibendum felis tincidunt eu. Sed elit dui, pretium sed dolor non, tempor congue augue. Sed eget leo at urna condimentum pretium nec sed ligula. Sed facilisis lorem ac lectus aliquam laoreet. Nulla vitae purus porttitor, tristique urna a, euismod sem. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam felis mi, ornare ut tellus vitae, pellentesque volutpat augue. Praesent mattis, metus id semper faucibus, mi sapien lacinia dolor, quis egestas sem metus at justo. Donec sit amet libero auctor, posuere orci at, posuere tortor. Curabitur lobortis pretium orci quis ultrices. Integer feugiat, ex ac dignissim pretium, metus dolor suscipit neque, at semper odio sem quis nulla. Cras facilisis felis metus, in pharetra quam mollis sit amet. Cras sit amet odio dapibus, ultricies urna sit amet, commodo nibh. Sed convallis non libero at iaculis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;

Donec mauris mi, sodales id condimentum eget, condimentum ut lorem. Integer sit amet mauris quam. Curabitur sit amet nulla vitae est hendrerit scelerisque sed vel elit. Nulla quis viverra ex. Integer accumsan congue lacus, vitae volutpat neque cursus nec. Ut id diam sollicitudin ex fringilla feugiat volutpat et felis. Suspendisse potenti. Curabitur dictum dolor et nisi vehicula, sed placerat odio molestie. Vivamus ultrices eu lorem nec sollicitudin. Aliquam porttitor nulla in eros convallis maximus.</div>
</body></html>
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 05:03 pm

Olá!

Não queria o texto a começar mesmo no canto e terminar no canto, queria tipo centrado percebeu amigo? Assim como este:
- http://www.forumeiros.com/condicoes-gerais

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Lima 3005 em 11/05/15, 05:06 pm

Amigo, você substituindo o texto irá ver que não vai ficar como você pensa! Experimente!

Código:
<html><head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet"><style type="text/css"></style><style type="text/css"></style><style type="text/css"></style></head>
  
<body><div id="header-wrapper">
  <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div><div class="bloqvip"><a href="#" target="_blank"><div class="tibq">Fórum</div></a></div>


<div class="social">
  <a href=""><i class="fa fa-facebook"></i></a>


<a href=""><i class="fa fa-twitter"></i></a>
  
  </div>
<style>
  .conteudo {
  text-align: justify;
  font-size: 15px;
  padding: 50px 100px 0px 100px;
}
  .social {
  position: relative;
  margin-top: 60px;
}

i.fa.fa-twitter:hover {
  color: rgb(85, 172, 238);
  cursor: pointer;
}
i.fa.fa-facebook:hover {
  color: rgb(58, 87, 149);
  cursor: pointer;
}
i.fa.fa-facebook, i.fa.fa-twitter {
  font-size: 20px;
  color: white;
  position: relative;
  float: right;
  margin-top: -20px;
  padding: 10px;
  transition: 1s;
}
  .fa-facebook-f:before, .fa-facebook:before {
  content: "\f09a";
}
.fa-twitter:before {
  content: "\f099";
}
  .fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }
.bloqvip {
  background: #71A200;
  text-align: center;
  padding: 8px;
  position: relative;
  top: 35px;
  box-shadow: 0px 5px 8px 0px rgba(93, 93, 93, 0.17) inset;
  -webkit-transition: 0.3s;
  -moz-transition-duration: 0.3s;
  -htm-transition-duration: 0.3s;
  border-radius: 5px;
  float: right;
  left: 130px;
}
.bloqvip:hover {
  transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}
.tibq {
  font-size: 20px;
  font-family: verdana;
  font-style: normal;
  font-weight: bold;
  color: white;
}
a:link {
  color: #FAFAFA;
}.pun .anuncbloq a {
  color: white;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.26);
  display: block;
  padding: 10px;
  font: italic 15px arial;
}
  border-radius: 5px;
</style>
    </div></div>
  <div class="conteudo">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque neque enim, varius ac venenatis lobortis, pharetra id dui. Nunc pellentesque sapien eu libero volutpat feugiat. Integer suscipit nunc diam. Morbi tincidunt eu risus in ultrices. Etiam risus est, commodo id massa eu, venenatis luctus felis. Nullam in feugiat nulla. Sed mauris arcu, vehicula ut ornare quis, vestibulum ut libero. Vivamus vel faucibus nisi. Nunc dignissim elementum fermentum. Phasellus ut neque leo. Maecenas viverra sed turpis sit amet sollicitudin. Fusce rhoncus eget diam non fermentum. Proin placerat, magna in iaculis lobortis, metus est auctor nisl, in tristique urna magna ac turpis.

Morbi tellus metus, finibus a euismod eu, dignissim eu nulla. Nam eu pretium ex. Cras viverra sit amet felis vitae luctus. Morbi semper a risus at hendrerit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec elit urna, bibendum efficitur enim at, posuere congue ligula. Fusce malesuada lacus non arcu placerat eleifend. Suspendisse urna felis, tincidunt in dapibus sit amet, scelerisque sed ex. Nulla mattis mi eu dolor consectetur euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus.

Suspendisse semper finibus magna vitae vehicula. Proin venenatis, lorem nec luctus luctus, quam dolor fermentum enim, sit amet congue leo sapien sed sem. Maecenas dictum purus sem, ut ullamcorper dui auctor a. Nulla facilisi. Cras lobortis rutrum orci, non luctus orci iaculis sagittis. Mauris massa massa, pharetra eu placerat vitae, mollis ut massa. Suspendisse eget magna eu nisi volutpat tincidunt at vel ligula. Sed a lacinia leo. Sed sed ipsum a massa ultricies tempus. In consectetur pharetra mi, vel fermentum arcu posuere sit amet. Vestibulum arcu dui, venenatis at nunc eget, rhoncus scelerisque dolor. Nullam feugiat turpis nec ornare rutrum.

Aenean molestie, eros id facilisis hendrerit, quam lorem placerat sem, in mollis tellus lorem nec odio. Curabitur at interdum odio. Proin tempus diam aliquam odio suscipit faucibus. Ut sed felis eget quam scelerisque volutpat id aliquet ex. Cras maximus id sapien nec accumsan. Suspendisse interdum aliquam sagittis. Aliquam commodo mollis quam, et auctor risus dapibus et. Quisque eget enim interdum, mollis arcu volutpat, rutrum arcu. Suspendisse laoreet dolor id tellus molestie fermentum at quis est. Proin posuere bibendum imperdiet. Donec ultrices ligula id quam vulputate hendrerit.

Curabitur tincidunt non libero a blandit. Curabitur non arcu neque. Cras vel porttitor erat, sit amet tristique libero. Duis posuere a tellus sed ultrices. Phasellus consequat, lorem aliquam suscipit auctor, lectus nunc fermentum arcu, ac volutpat nisl dolor vitae nibh. Curabitur lacinia ipsum quis tortor suscipit malesuada. In quis dolor egestas, sollicitudin tortor quis, egestas nisl. Sed quis dapibus dolor, vitae volutpat eros. Vivamus tortor felis, molestie nec felis eu, tincidunt eleifend enim. Phasellus eu sapien quis lectus finibus volutpat non vitae nibh. Vivamus hendrerit consectetur odio ultrices consectetur. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris volutpat vitae velit congue eleifend. Cras dolor erat, iaculis nec dignissim sit amet, aliquet non augue.

Quisque commodo varius urna, non convallis lectus interdum ut. Duis vel nulla enim. Fusce dolor nibh, ullamcorper non felis sit amet, condimentum sagittis eros. Sed nec tempor augue. Suspendisse potenti. Nunc nec tempor lacus, et mollis enim. Nullam velit erat, pretium ac elit ac, fringilla blandit velit.

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce nec lacus in arcu aliquam ultricies et a mi. Vestibulum pellentesque, est ac sollicitudin maximus, purus enim finibus dolor, eget dictum metus eros et arcu. Mauris vel dui dictum justo ultrices vestibulum eget eget turpis. Vestibulum malesuada sem libero, nec vestibulum libero ornare id. Suspendisse pulvinar ultricies elit in pellentesque. Nam vestibulum, tellus a tincidunt viverra, lorem felis convallis diam, quis egestas nunc magna non enim. Nulla sit amet porta nisi. Donec vel semper dolor.

Phasellus tempus risus et egestas condimentum. Aliquam a dignissim orci, quis ultricies ex. Donec congue mattis tortor, in vestibulum enim dignissim a. Nunc nibh lectus, egestas ac suscipit non, tempor id quam. Duis sed justo ut nibh porttitor dapibus. Cras mauris leo, pharetra ut sapien ut, imperdiet tristique ex. Nam nec nisl eu urna tempor luctus. Vivamus aliquam diam eget auctor mattis. Maecenas feugiat ligula sed est cursus accumsan. Praesent massa augue, condimentum nec tincidunt sed, suscipit at libero. Nulla non arcu massa. Nunc risus tortor, consectetur id tincidunt quis, lacinia sed dui. Pellentesque laoreet sapien eu sem porttitor tristique.

Etiam elementum ex neque, scelerisque bibendum felis tincidunt eu. Sed elit dui, pretium sed dolor non, tempor congue augue. Sed eget leo at urna condimentum pretium nec sed ligula. Sed facilisis lorem ac lectus aliquam laoreet. Nulla vitae purus porttitor, tristique urna a, euismod sem. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam felis mi, ornare ut tellus vitae, pellentesque volutpat augue. Praesent mattis, metus id semper faucibus, mi sapien lacinia dolor, quis egestas sem metus at justo. Donec sit amet libero auctor, posuere orci at, posuere tortor. Curabitur lobortis pretium orci quis ultrices. Integer feugiat, ex ac dignissim pretium, metus dolor suscipit neque, at semper odio sem quis nulla. Cras facilisis felis metus, in pharetra quam mollis sit amet. Cras sit amet odio dapibus, ultricies urna sit amet, commodo nibh. Sed convallis non libero at iaculis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;

Donec mauris mi, sodales id condimentum eget, condimentum ut lorem. Integer sit amet mauris quam. Curabitur sit amet nulla vitae est hendrerit scelerisque sed vel elit. Nulla quis viverra ex. Integer accumsan congue lacus, vitae volutpat neque cursus nec. Ut id diam sollicitudin ex fringilla feugiat volutpat et felis. Suspendisse potenti. Curabitur dictum dolor et nisi vehicula, sed placerat odio molestie. Vivamus ultrices eu lorem nec sollicitudin. Aliquam porttitor nulla in eros convallis maximus.</div>
</body></html>
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 05:12 pm

Olá!

Ficou perfeito simplesmente, agora para terminar a página, é possível adicionar o footer mesmo do fórum?
- http://suportedesign.forumeiros.com/

Será que consegue?

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Lima 3005 em 11/05/15, 05:29 pm

Se você puder enviar o texto agradecia, porque é muito relativo!
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 05:37 pm

Olá!

Texto amigo? Que texto? Pedi o footer amigo, o texto está perfeito!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Lima 3005 em 11/05/15, 05:42 pm

Desculpe amigo!!!

Código:
<html><head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet"><style type="text/css"></style><style type="text/css"></style><style type="text/css"></style><style type="text/css"></style></head>
 
<body><div id="header-wrapper">
  <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div><div class="bloqvip"><a href="#" target="_blank"><div class="tibq">Fórum</div></a></div>


<div class="social">
  <a href=""><i class="fa fa-facebook"></i></a>


<a href=""><i class="fa fa-twitter"></i></a>
 
  </div>
<style>p.loadtime.smalltext a {
  font-weight: bold;
}

#footer a {
  color: #C0C0C0;
}
#footer, #footer a {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
}
.tf_main {
  margin: 0 auto;
  width: 78%;
  min-width: 960px;
}
#footer .backtop {
  position: absolute;
  left: 50%;
  top: 40px;
  background: url(http://i.imgur.com/KyM4pyT.png) no-repeat;
  display: block;
  width: 30px;
  height: 30px;
  margin-left: -15px;
}
#footer .backtop {
  background: url(http://i.imgur.com/KyM4pyT.png) no-repeat;
  display: block;
  height: 30px;
  left: 50%;
  position: absolute;
  top: 25px!important;
  width: 30px;
}
  #footer {
  padding: 90px 0 40px;
  border-top: 4px solid #7AB6A3;
  color: #727272;
  text-align: center;
  position: relative;
  background: #303030;
}
#footer, #footer a {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
}
#footer {
  background: #303030;
  border-top: 4px solid #7AB6A3;
  color: #727272;
  padding: 85px 0 20px!important;
  text-align: center;
}
  .conteudo {
  text-align: justify;
  font-size: 15px;
  padding: 50px 100px 0px 100px;
}
  .social {
  position: relative;
  margin-top: 60px;
}

i.fa.fa-twitter:hover {
  color: rgb(85, 172, 238);
  cursor: pointer;
}
i.fa.fa-facebook:hover {
  color: rgb(58, 87, 149);
  cursor: pointer;
}
i.fa.fa-facebook, i.fa.fa-twitter {
  font-size: 20px;
  color: white;
  position: relative;
  float: right;
  margin-top: -20px;
  padding: 10px;
  transition: 1s;
}
  .fa-facebook-f:before, .fa-facebook:before {
  content: "\f09a";
}
.fa-twitter:before {
  content: "\f099";
}
  .fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }
.bloqvip {
  background: #71A200;
  text-align: center;
  padding: 8px;
  position: relative;
  top: 35px;
  box-shadow: 0px 5px 8px 0px rgba(93, 93, 93, 0.17) inset;
  -webkit-transition: 0.3s;
  -moz-transition-duration: 0.3s;
  -htm-transition-duration: 0.3s;
  border-radius: 5px;
  float: right;
  left: 130px;
}
.bloqvip:hover {
  transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}
.tibq {
  font-size: 20px;
  font-family: verdana;
  font-style: normal;
  font-weight: bold;
  color: white;
}
a:link {
  color: #FAFAFA;
}.pun .anuncbloq a {
  color: white;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.26);
  display: block;
  padding: 10px;
  font: italic 15px arial;
}
  border-radius: 5px;
</style>
    </div></div>
  <div class="conteudo">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque neque enim, varius ac venenatis lobortis, pharetra id dui. Nunc pellentesque sapien eu libero volutpat feugiat. Integer suscipit nunc diam. Morbi tincidunt eu risus in ultrices. Etiam risus est, commodo id massa eu, venenatis luctus felis. Nullam in feugiat nulla. Sed mauris arcu, vehicula ut ornare quis, vestibulum ut libero. Vivamus vel faucibus nisi. Nunc dignissim elementum fermentum. Phasellus ut neque leo. Maecenas viverra sed turpis sit amet sollicitudin. Fusce rhoncus eget diam non fermentum. Proin placerat, magna in iaculis lobortis, metus est auctor nisl, in tristique urna magna ac turpis.

Morbi tellus metus, finibus a euismod eu, dignissim eu nulla. Nam eu pretium ex. Cras viverra sit amet felis vitae luctus. Morbi semper a risus at hendrerit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec elit urna, bibendum efficitur enim at, posuere congue ligula. Fusce malesuada lacus non arcu placerat eleifend. Suspendisse urna felis, tincidunt in dapibus sit amet, scelerisque sed ex. Nulla mattis mi eu dolor consectetur euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus.

Suspendisse semper finibus magna vitae vehicula. Proin venenatis, lorem nec luctus luctus, quam dolor fermentum enim, sit amet congue leo sapien sed sem. Maecenas dictum purus sem, ut ullamcorper dui auctor a. Nulla facilisi. Cras lobortis rutrum orci, non luctus orci iaculis sagittis. Mauris massa massa, pharetra eu placerat vitae, mollis ut massa. Suspendisse eget magna eu nisi volutpat tincidunt at vel ligula. Sed a lacinia leo. Sed sed ipsum a massa ultricies tempus. In consectetur pharetra mi, vel fermentum arcu posuere sit amet. Vestibulum arcu dui, venenatis at nunc eget, rhoncus scelerisque dolor. Nullam feugiat turpis nec ornare rutrum.

Aenean molestie, eros id facilisis hendrerit, quam lorem placerat sem, in mollis tellus lorem nec odio. Curabitur at interdum odio. Proin tempus diam aliquam odio suscipit faucibus. Ut sed felis eget quam scelerisque volutpat id aliquet ex. Cras maximus id sapien nec accumsan. Suspendisse interdum aliquam sagittis. Aliquam commodo mollis quam, et auctor risus dapibus et. Quisque eget enim interdum, mollis arcu volutpat, rutrum arcu. Suspendisse laoreet dolor id tellus molestie fermentum at quis est. Proin posuere bibendum imperdiet. Donec ultrices ligula id quam vulputate hendrerit.

Curabitur tincidunt non libero a blandit. Curabitur non arcu neque. Cras vel porttitor erat, sit amet tristique libero. Duis posuere a tellus sed ultrices. Phasellus consequat, lorem aliquam suscipit auctor, lectus nunc fermentum arcu, ac volutpat nisl dolor vitae nibh. Curabitur lacinia ipsum quis tortor suscipit malesuada. In quis dolor egestas, sollicitudin tortor quis, egestas nisl. Sed quis dapibus dolor, vitae volutpat eros. Vivamus tortor felis, molestie nec felis eu, tincidunt eleifend enim. Phasellus eu sapien quis lectus finibus volutpat non vitae nibh. Vivamus hendrerit consectetur odio ultrices consectetur. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris volutpat vitae velit congue eleifend. Cras dolor erat, iaculis nec dignissim sit amet, aliquet non augue.

Quisque commodo varius urna, non convallis lectus interdum ut. Duis vel nulla enim. Fusce dolor nibh, ullamcorper non felis sit amet, condimentum sagittis eros. Sed nec tempor augue. Suspendisse potenti. Nunc nec tempor lacus, et mollis enim. Nullam velit erat, pretium ac elit ac, fringilla blandit velit.

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce nec lacus in arcu aliquam ultricies et a mi. Vestibulum pellentesque, est ac sollicitudin maximus, purus enim finibus dolor, eget dictum metus eros et arcu. Mauris vel dui dictum justo ultrices vestibulum eget eget turpis. Vestibulum malesuada sem libero, nec vestibulum libero ornare id. Suspendisse pulvinar ultricies elit in pellentesque. Nam vestibulum, tellus a tincidunt viverra, lorem felis convallis diam, quis egestas nunc magna non enim. Nulla sit amet porta nisi. Donec vel semper dolor.

Phasellus tempus risus et egestas condimentum. Aliquam a dignissim orci, quis ultricies ex. Donec congue mattis tortor, in vestibulum enim dignissim a. Nunc nibh lectus, egestas ac suscipit non, tempor id quam. Duis sed justo ut nibh porttitor dapibus. Cras mauris leo, pharetra ut sapien ut, imperdiet tristique ex. Nam nec nisl eu urna tempor luctus. Vivamus aliquam diam eget auctor mattis. Maecenas feugiat ligula sed est cursus accumsan. Praesent massa augue, condimentum nec tincidunt sed, suscipit at libero. Nulla non arcu massa. Nunc risus tortor, consectetur id tincidunt quis, lacinia sed dui. Pellentesque laoreet sapien eu sem porttitor tristique.

Etiam elementum ex neque, scelerisque bibendum felis tincidunt eu. Sed elit dui, pretium sed dolor non, tempor congue augue. Sed eget leo at urna condimentum pretium nec sed ligula. Sed facilisis lorem ac lectus aliquam laoreet. Nulla vitae purus porttitor, tristique urna a, euismod sem. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam felis mi, ornare ut tellus vitae, pellentesque volutpat augue. Praesent mattis, metus id semper faucibus, mi sapien lacinia dolor, quis egestas sem metus at justo. Donec sit amet libero auctor, posuere orci at, posuere tortor. Curabitur lobortis pretium orci quis ultrices. Integer feugiat, ex ac dignissim pretium, metus dolor suscipit neque, at semper odio sem quis nulla. Cras facilisis felis metus, in pharetra quam mollis sit amet. Cras sit amet odio dapibus, ultricies urna sit amet, commodo nibh. Sed convallis non libero at iaculis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;

Donec mauris mi, sodales id condimentum eget, condimentum ut lorem. Integer sit amet mauris quam. Curabitur sit amet nulla vitae est hendrerit scelerisque sed vel elit. Nulla quis viverra ex. Integer accumsan congue lacus, vitae volutpat neque cursus nec. Ut id diam sollicitudin ex fringilla feugiat volutpat et felis. Suspendisse potenti. Curabitur dictum dolor et nisi vehicula, sed placerat odio molestie. Vivamus ultrices eu lorem nec sollicitudin. Aliquam porttitor nulla in eros convallis maximus.</div>
 
  <div id="footer"><div class="tf_main"><a class="backtop" href="#"></a>  <span class="smalltext" style="display: inline; visibility: visible; font-family: Verdana, Arial, sans-serif;"><a title="" target="_blank" class="new_win">© Suporte Design | DzinerStudio - Todos os Direitos Reservados</a></span><p class="loadtime smalltext"><strong><a href="http://www.criarforum.com" target="_blank">Criar fórum</a></strong> | <span class="gensmall">©</span> <a href="http://www.forumeiros.com/punbb" target="_blank">PunBB</a> | <a name="bottom" href="http://ajuda.forumeiros.com/" target="_blank">Fórum grátis de ajuda</a> |&nbsp;<a href="/abuse?page=%2Fforum&amp;report=1" rel="nofollow">Assinalar uma queixa</a></p></div></div>
</body></html>

Funcionou?
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 11/05/15, 05:44 pm

Olá!

Poderia juntar mais como no fórum? E retirar o "Criar fórum | © PunBB | Fórum grátis de ajuda | Assinalar uma queixa" e de resto está perfeito!

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Sennior em 11/05/15, 08:24 pm

Saudações,

Assim?
Código:
<html><head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet"><style type="text/css"></style><style type="text/css"></style><style type="text/css"></style><style type="text/css"></style></head>
 
<body><div id="header-wrapper">
  <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div><div class="bloqvip"><a href="#" target="_blank"><div class="tibq">Fórum</div></a></div>


<div class="social">
  <a href=""><i class="fa fa-facebook"></i></a>


<a href=""><i class="fa fa-twitter"></i></a>
 
  </div>
<style>p.loadtime.smalltext a {
  font-weight: bold;
}

#footer a {
  color: #C0C0C0;
}
#footer, #footer a {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
}
.tf_main {
  margin: 0 auto;
  width: 78%;
  min-width: 960px;
}
#footer .backtop {
  position: absolute;
  left: 50%;
  top: 40px;
  background: url(http://i.imgur.com/KyM4pyT.png) no-repeat;
  display: block;
  width: 30px;
  height: 30px;
  margin-left: -15px;
}
#footer .backtop {
  background: url(http://i.imgur.com/KyM4pyT.png) no-repeat;
  display: block;
  height: 30px;
  left: 50%;
  position: absolute;
  top: 25px!important;
  width: 30px;
}
  #footer {
  padding: 90px 0 40px;
  border-top: 4px solid #7AB6A3;
  color: #727272;
  text-align: center;
  position: relative;
  background: #303030;
}
#footer, #footer a {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
}
#footer {
  background: #303030;
  border-top: 4px solid #7AB6A3;
  color: #727272;
  padding: 85px 0 20px!important;
  text-align: center;
}
  .conteudo {
  text-align: justify;
  font-size: 15px;
  padding: 50px 100px 0px 100px;
}
 .social {
  position: relative;
  margin-top: 55px;
  left: -13pc;
}

i.fa.fa-twitter:hover {
  color: rgb(85, 172, 238);
  cursor: pointer;
}
i.fa.fa-facebook:hover {
  color: rgb(58, 87, 149);
  cursor: pointer;
}
i.fa.fa-facebook, i.fa.fa-twitter {
  font-size: 20px;
  color: white;
  position: relative;
  float: right;
  margin-top: -20px;
  padding: 10px;
  transition: 1s;
}
  .fa-facebook-f:before, .fa-facebook:before {
  content: "\f09a";
}
.fa-twitter:before {
  content: "\f099";
}
  .fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }
.bloqvip {
  background: #71A200;
  text-align: center;
  padding: 8px;
  position: relative;
  top: 35px;
  box-shadow: 0px 5px 8px 0px rgba(93, 93, 93, 0.17) inset;
  -webkit-transition: 0.3s;
  -moz-transition-duration: 0.3s;
  -htm-transition-duration: 0.3s;
  border-radius: 5px;
  float: right;
  left: -21pc;
}
.bloqvip:hover {
  transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}
.tibq {
  font-size: 20px;
  font-family: verdana;
  font-style: normal;
  font-weight: bold;
  color: white;
}
a:link {
  color: #FAFAFA;
}.pun .anuncbloq a {
  color: white;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.26);
  display: block;
  padding: 10px;
  font: italic 15px arial;
}
  border-radius: 5px;
</style>
    </div></div>
  <div class="conteudo">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque neque enim, varius ac venenatis lobortis, pharetra id dui. Nunc pellentesque sapien eu libero volutpat feugiat. Integer suscipit nunc diam. Morbi tincidunt eu risus in ultrices. Etiam risus est, commodo id massa eu, venenatis luctus felis. Nullam in feugiat nulla. Sed mauris arcu, vehicula ut ornare quis, vestibulum ut libero. Vivamus vel faucibus nisi. Nunc dignissim elementum fermentum. Phasellus ut neque leo. Maecenas viverra sed turpis sit amet sollicitudin. Fusce rhoncus eget diam non fermentum. Proin placerat, magna in iaculis lobortis, metus est auctor nisl, in tristique urna magna ac turpis.

Morbi tellus metus, finibus a euismod eu, dignissim eu nulla. Nam eu pretium ex. Cras viverra sit amet felis vitae luctus. Morbi semper a risus at hendrerit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec elit urna, bibendum efficitur enim at, posuere congue ligula. Fusce malesuada lacus non arcu placerat eleifend. Suspendisse urna felis, tincidunt in dapibus sit amet, scelerisque sed ex. Nulla mattis mi eu dolor consectetur euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus.

Suspendisse semper finibus magna vitae vehicula. Proin venenatis, lorem nec luctus luctus, quam dolor fermentum enim, sit amet congue leo sapien sed sem. Maecenas dictum purus sem, ut ullamcorper dui auctor a. Nulla facilisi. Cras lobortis rutrum orci, non luctus orci iaculis sagittis. Mauris massa massa, pharetra eu placerat vitae, mollis ut massa. Suspendisse eget magna eu nisi volutpat tincidunt at vel ligula. Sed a lacinia leo. Sed sed ipsum a massa ultricies tempus. In consectetur pharetra mi, vel fermentum arcu posuere sit amet. Vestibulum arcu dui, venenatis at nunc eget, rhoncus scelerisque dolor. Nullam feugiat turpis nec ornare rutrum.

Aenean molestie, eros id facilisis hendrerit, quam lorem placerat sem, in mollis tellus lorem nec odio. Curabitur at interdum odio. Proin tempus diam aliquam odio suscipit faucibus. Ut sed felis eget quam scelerisque volutpat id aliquet ex. Cras maximus id sapien nec accumsan. Suspendisse interdum aliquam sagittis. Aliquam commodo mollis quam, et auctor risus dapibus et. Quisque eget enim interdum, mollis arcu volutpat, rutrum arcu. Suspendisse laoreet dolor id tellus molestie fermentum at quis est. Proin posuere bibendum imperdiet. Donec ultrices ligula id quam vulputate hendrerit.

Curabitur tincidunt non libero a blandit. Curabitur non arcu neque. Cras vel porttitor erat, sit amet tristique libero. Duis posuere a tellus sed ultrices. Phasellus consequat, lorem aliquam suscipit auctor, lectus nunc fermentum arcu, ac volutpat nisl dolor vitae nibh. Curabitur lacinia ipsum quis tortor suscipit malesuada. In quis dolor egestas, sollicitudin tortor quis, egestas nisl. Sed quis dapibus dolor, vitae volutpat eros. Vivamus tortor felis, molestie nec felis eu, tincidunt eleifend enim. Phasellus eu sapien quis lectus finibus volutpat non vitae nibh. Vivamus hendrerit consectetur odio ultrices consectetur. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris volutpat vitae velit congue eleifend. Cras dolor erat, iaculis nec dignissim sit amet, aliquet non augue.

Quisque commodo varius urna, non convallis lectus interdum ut. Duis vel nulla enim. Fusce dolor nibh, ullamcorper non felis sit amet, condimentum sagittis eros. Sed nec tempor augue. Suspendisse potenti. Nunc nec tempor lacus, et mollis enim. Nullam velit erat, pretium ac elit ac, fringilla blandit velit.

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce nec lacus in arcu aliquam ultricies et a mi. Vestibulum pellentesque, est ac sollicitudin maximus, purus enim finibus dolor, eget dictum metus eros et arcu. Mauris vel dui dictum justo ultrices vestibulum eget eget turpis. Vestibulum malesuada sem libero, nec vestibulum libero ornare id. Suspendisse pulvinar ultricies elit in pellentesque. Nam vestibulum, tellus a tincidunt viverra, lorem felis convallis diam, quis egestas nunc magna non enim. Nulla sit amet porta nisi. Donec vel semper dolor.

Phasellus tempus risus et egestas condimentum. Aliquam a dignissim orci, quis ultricies ex. Donec congue mattis tortor, in vestibulum enim dignissim a. Nunc nibh lectus, egestas ac suscipit non, tempor id quam. Duis sed justo ut nibh porttitor dapibus. Cras mauris leo, pharetra ut sapien ut, imperdiet tristique ex. Nam nec nisl eu urna tempor luctus. Vivamus aliquam diam eget auctor mattis. Maecenas feugiat ligula sed est cursus accumsan. Praesent massa augue, condimentum nec tincidunt sed, suscipit at libero. Nulla non arcu massa. Nunc risus tortor, consectetur id tincidunt quis, lacinia sed dui. Pellentesque laoreet sapien eu sem porttitor tristique.

Etiam elementum ex neque, scelerisque bibendum felis tincidunt eu. Sed elit dui, pretium sed dolor non, tempor congue augue. Sed eget leo at urna condimentum pretium nec sed ligula. Sed facilisis lorem ac lectus aliquam laoreet. Nulla vitae purus porttitor, tristique urna a, euismod sem. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam felis mi, ornare ut tellus vitae, pellentesque volutpat augue. Praesent mattis, metus id semper faucibus, mi sapien lacinia dolor, quis egestas sem metus at justo. Donec sit amet libero auctor, posuere orci at, posuere tortor. Curabitur lobortis pretium orci quis ultrices. Integer feugiat, ex ac dignissim pretium, metus dolor suscipit neque, at semper odio sem quis nulla. Cras facilisis felis metus, in pharetra quam mollis sit amet. Cras sit amet odio dapibus, ultricies urna sit amet, commodo nibh. Sed convallis non libero at iaculis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;

Donec mauris mi, sodales id condimentum eget, condimentum ut lorem. Integer sit amet mauris quam. Curabitur sit amet nulla vitae est hendrerit scelerisque sed vel elit. Nulla quis viverra ex. Integer accumsan congue lacus, vitae volutpat neque cursus nec. Ut id diam sollicitudin ex fringilla feugiat volutpat et felis. Suspendisse potenti. Curabitur dictum dolor et nisi vehicula, sed placerat odio molestie. Vivamus ultrices eu lorem nec sollicitudin. Aliquam porttitor nulla in eros convallis maximus.</div>
 
  <div id="footer"><div class="tf_main"><a class="backtop" href="#"></a>  <span class="smalltext" style="display: inline; visibility: visible; font-family: Verdana, Arial, sans-serif;"><a title="" target="_blank" class="new_win">© Suporte Design | DzinerStudio - Todos os Direitos Reservados</a></span>></div></div>
</body></html>

Até mais.
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 12/05/15, 04:41 am

Olá!

Isso mesmo, mas poderia juntar a seta ao texto mais? E colocar o footer mais fino?

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Sennior em 12/05/15, 06:30 am

Saudações,

Asim esta bom?
Código:
<html><head><script src="" async=""></script><script src="" async=""></script><meta content="text/html;charset=utf-8" http-equiv="Content-Type"><title>Suporte Design - Condições Gerais</title><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="shortcut icon"><link href="http://i19.servimg.com/u/f19/18/07/03/67/sdfav10.png" rel="icon">
<meta content="SD" name="description"><meta content="SD" name="keywords"><meta content="«TaysonFenix»" name="author">
  <link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/reset.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/text.css" rel="stylesheet"><link type="text/css" href="https://googledrive.com/host/0BxD6ArFF-6TkWGhka1JzbVYwY1k/style2.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.css" rel="stylesheet"><style type="text/css"></style><style type="text/css"></style><style type="text/css"></style><style type="text/css"></style></head>
 
<body><div id="header-wrapper">
  <div class="container" id="header-container">
      <div id="header-logo"><a href="index.html"><img alt="SD" src="http://i.imgur.com/6q7p92N.png"></a></div><div class="bloqvip"><a href="#" target="_blank"><div class="tibq">Fórum</div></a></div>


<div class="social">
  <a href=""><i class="fa fa-facebook"></i></a>


<a href=""><i class="fa fa-twitter"></i></a>
 
  </div>
<style>p.loadtime.smalltext a {
  font-weight: bold;
}

#footer a {
  color: #C0C0C0;
}
#footer, #footer a {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
}
.tf_main {
  margin: 0 auto;
  width: 78%;
  min-width: 960px;
}
#footer .backtop {
  position: absolute;
  left: 50%;
  top: 8px;
  background: url(http://i.imgur.com/KyM4pyT.png) no-repeat;
  display: block;
  width: 30px;
  height: 30px;
  margin-left: -15px;
}
#footer .backtop {
  background: url(http://i.imgur.com/KyM4pyT.png) no-repeat;
  display: block;
  height: 30px;
  left: 50%;
  position: absolute;
  top: 8px!important;
  width: 30px;
}
span.smalltext {
  position: relative;
  top: 18px;
}
  #footer {
  padding: 90px 0 40px;
  border-top: 4px solid #7AB6A3;
  color: #727272;
  text-align: center;
  position: relative;
  background: #303030;
}
#footer, #footer a {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
}
#footer {
  background: #303030;
  border-top: 4px solid #7AB6A3;
  color: #727272;
  padding: 25px 0 20px!important;
  text-align: center;
}
  .conteudo {
  text-align: justify;
  font-size: 15px;
  padding: 50px 100px 0px 100px;
}
 .social {
  position: relative;
  margin-top: 55px;
  left: -13pc;
}

i.fa.fa-twitter:hover {
  color: rgb(85, 172, 238);
  cursor: pointer;
}
i.fa.fa-facebook:hover {
  color: rgb(58, 87, 149);
  cursor: pointer;
}
i.fa.fa-facebook, i.fa.fa-twitter {
  font-size: 20px;
  color: white;
  position: relative;
  float: right;
  margin-top: -20px;
  padding: 10px;
  transition: 1s;
}
  .fa-facebook-f:before, .fa-facebook:before {
  content: "\f09a";
}
.fa-twitter:before {
  content: "\f099";
}
  .fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}
#header-wrapper {
    height: 125px;
    border-bottom: 2px solid #7AC5AD;
    background: none repeat scroll 0% 0% #333;
  }
.bloqvip {
  background: #71A200;
  text-align: center;
  padding: 8px;
  position: relative;
  top: 35px;
  box-shadow: 0px 5px 8px 0px rgba(93, 93, 93, 0.17) inset;
  -webkit-transition: 0.3s;
  -moz-transition-duration: 0.3s;
  -htm-transition-duration: 0.3s;
  border-radius: 5px;
  float: right;
  left: -21pc;
}
.bloqvip:hover {
  transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
}
.tibq {
  font-size: 20px;
  font-family: verdana;
  font-style: normal;
  font-weight: bold;
  color: white;
}
a:link {
  color: #FAFAFA;
}.pun .anuncbloq a {
  color: white;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.26);
  display: block;
  padding: 10px;
  font: italic 15px arial;
}
  border-radius: 5px;
</style>
    </div></div>
  <div class="conteudo">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque neque enim, varius ac venenatis lobortis, pharetra id dui. Nunc pellentesque sapien eu libero volutpat feugiat. Integer suscipit nunc diam. Morbi tincidunt eu risus in ultrices. Etiam risus est, commodo id massa eu, venenatis luctus felis. Nullam in feugiat nulla. Sed mauris arcu, vehicula ut ornare quis, vestibulum ut libero. Vivamus vel faucibus nisi. Nunc dignissim elementum fermentum. Phasellus ut neque leo. Maecenas viverra sed turpis sit amet sollicitudin. Fusce rhoncus eget diam non fermentum. Proin placerat, magna in iaculis lobortis, metus est auctor nisl, in tristique urna magna ac turpis.

Morbi tellus metus, finibus a euismod eu, dignissim eu nulla. Nam eu pretium ex. Cras viverra sit amet felis vitae luctus. Morbi semper a risus at hendrerit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec elit urna, bibendum efficitur enim at, posuere congue ligula. Fusce malesuada lacus non arcu placerat eleifend. Suspendisse urna felis, tincidunt in dapibus sit amet, scelerisque sed ex. Nulla mattis mi eu dolor consectetur euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus.

Suspendisse semper finibus magna vitae vehicula. Proin venenatis, lorem nec luctus luctus, quam dolor fermentum enim, sit amet congue leo sapien sed sem. Maecenas dictum purus sem, ut ullamcorper dui auctor a. Nulla facilisi. Cras lobortis rutrum orci, non luctus orci iaculis sagittis. Mauris massa massa, pharetra eu placerat vitae, mollis ut massa. Suspendisse eget magna eu nisi volutpat tincidunt at vel ligula. Sed a lacinia leo. Sed sed ipsum a massa ultricies tempus. In consectetur pharetra mi, vel fermentum arcu posuere sit amet. Vestibulum arcu dui, venenatis at nunc eget, rhoncus scelerisque dolor. Nullam feugiat turpis nec ornare rutrum.

Aenean molestie, eros id facilisis hendrerit, quam lorem placerat sem, in mollis tellus lorem nec odio. Curabitur at interdum odio. Proin tempus diam aliquam odio suscipit faucibus. Ut sed felis eget quam scelerisque volutpat id aliquet ex. Cras maximus id sapien nec accumsan. Suspendisse interdum aliquam sagittis. Aliquam commodo mollis quam, et auctor risus dapibus et. Quisque eget enim interdum, mollis arcu volutpat, rutrum arcu. Suspendisse laoreet dolor id tellus molestie fermentum at quis est. Proin posuere bibendum imperdiet. Donec ultrices ligula id quam vulputate hendrerit.

Curabitur tincidunt non libero a blandit. Curabitur non arcu neque. Cras vel porttitor erat, sit amet tristique libero. Duis posuere a tellus sed ultrices. Phasellus consequat, lorem aliquam suscipit auctor, lectus nunc fermentum arcu, ac volutpat nisl dolor vitae nibh. Curabitur lacinia ipsum quis tortor suscipit malesuada. In quis dolor egestas, sollicitudin tortor quis, egestas nisl. Sed quis dapibus dolor, vitae volutpat eros. Vivamus tortor felis, molestie nec felis eu, tincidunt eleifend enim. Phasellus eu sapien quis lectus finibus volutpat non vitae nibh. Vivamus hendrerit consectetur odio ultrices consectetur. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris volutpat vitae velit congue eleifend. Cras dolor erat, iaculis nec dignissim sit amet, aliquet non augue.

Quisque commodo varius urna, non convallis lectus interdum ut. Duis vel nulla enim. Fusce dolor nibh, ullamcorper non felis sit amet, condimentum sagittis eros. Sed nec tempor augue. Suspendisse potenti. Nunc nec tempor lacus, et mollis enim. Nullam velit erat, pretium ac elit ac, fringilla blandit velit.

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce nec lacus in arcu aliquam ultricies et a mi. Vestibulum pellentesque, est ac sollicitudin maximus, purus enim finibus dolor, eget dictum metus eros et arcu. Mauris vel dui dictum justo ultrices vestibulum eget eget turpis. Vestibulum malesuada sem libero, nec vestibulum libero ornare id. Suspendisse pulvinar ultricies elit in pellentesque. Nam vestibulum, tellus a tincidunt viverra, lorem felis convallis diam, quis egestas nunc magna non enim. Nulla sit amet porta nisi. Donec vel semper dolor.

Phasellus tempus risus et egestas condimentum. Aliquam a dignissim orci, quis ultricies ex. Donec congue mattis tortor, in vestibulum enim dignissim a. Nunc nibh lectus, egestas ac suscipit non, tempor id quam. Duis sed justo ut nibh porttitor dapibus. Cras mauris leo, pharetra ut sapien ut, imperdiet tristique ex. Nam nec nisl eu urna tempor luctus. Vivamus aliquam diam eget auctor mattis. Maecenas feugiat ligula sed est cursus accumsan. Praesent massa augue, condimentum nec tincidunt sed, suscipit at libero. Nulla non arcu massa. Nunc risus tortor, consectetur id tincidunt quis, lacinia sed dui. Pellentesque laoreet sapien eu sem porttitor tristique.

Etiam elementum ex neque, scelerisque bibendum felis tincidunt eu. Sed elit dui, pretium sed dolor non, tempor congue augue. Sed eget leo at urna condimentum pretium nec sed ligula. Sed facilisis lorem ac lectus aliquam laoreet. Nulla vitae purus porttitor, tristique urna a, euismod sem. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam felis mi, ornare ut tellus vitae, pellentesque volutpat augue. Praesent mattis, metus id semper faucibus, mi sapien lacinia dolor, quis egestas sem metus at justo. Donec sit amet libero auctor, posuere orci at, posuere tortor. Curabitur lobortis pretium orci quis ultrices. Integer feugiat, ex ac dignissim pretium, metus dolor suscipit neque, at semper odio sem quis nulla. Cras facilisis felis metus, in pharetra quam mollis sit amet. Cras sit amet odio dapibus, ultricies urna sit amet, commodo nibh. Sed convallis non libero at iaculis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;

Donec mauris mi, sodales id condimentum eget, condimentum ut lorem. Integer sit amet mauris quam. Curabitur sit amet nulla vitae est hendrerit scelerisque sed vel elit. Nulla quis viverra ex. Integer accumsan congue lacus, vitae volutpat neque cursus nec. Ut id diam sollicitudin ex fringilla feugiat volutpat et felis. Suspendisse potenti. Curabitur dictum dolor et nisi vehicula, sed placerat odio molestie. Vivamus ultrices eu lorem nec sollicitudin. Aliquam porttitor nulla in eros convallis maximus.</div>
 
  <div id="footer"><div class="tf_main"><a class="backtop" href="#"></a>  <span class="smalltext" style="display: inline; visibility: visible; font-family: Verdana, Arial, sans-serif;"><a title="" target="_blank" class="new_win">© Suporte Design | DzinerStudio - Todos os Direitos Reservados</a></span></div></div>
</body></html>

Abraços.
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por IsmaelS. em 12/05/15, 09:03 am

Olá!

Perfeito amigo, resolvido e obrigados! Muito feliz

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2956
Pontos Ativos : 4096

Ver perfil do usuário http://suporte-design.forumeiros.com/

Resolvido Re: Colocar botão de menu em página HTML

Mensagem por Sennior em 12/05/15, 09:32 am

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

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