Página Principal em HTML

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

Resolvido Página Principal em HTML

Mensagem por kakakoro em 08/07/15, 01:23 pm

Olá, gostaria de ajuda para criar uma página principal em html para meu fórum. Com uma imagem de fundo e dois botões "Acessar Site " e outro para "Entre em contato!".

Na parte inferior, assim como no fórum, usar a imagem de rodapé com fundo png e os direitos copyright da Cior. Caso alguém possa me ajudar, passo as informações adicionais como imagem e cores.

www.clinicacior.forumeiros.com


Última edição por kakakoro em 14/07/15, 03:52 pm, editado 1 vez(es)
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Fraise em 08/07/15, 01:47 pm

Olá @kakakoro!

Você deseja que lhe digamos como colocar a página inicial como uma página HTML ou que lhe desenvolvamos uma página HTML para o senhor?

Cumprimentos!
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 08/07/15, 01:58 pm

Na verdade seria os dois @Fraise . Eu precisava apenas de uma página com uma imagem de fundo, que seria esta:

Colocar dois botões abaixo da logo, com um efeito simples, e um rodapé com esta imagem:

Eu já coloquei uma página html como principal, mas me esqueci. Se puder me ajudar Tive uma idéia! Tive uma idéia! Envergonhado Envergonhado Rosa
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Fraise em 08/07/15, 02:43 pm

Olá!

Quanto à criação da página HTML não lhe posso ajudar, mas para colocar uma página html como página inicial será assim:
Painel de Controle ->> Visualização ->> Página Inicial ->> Geral

Em "Página inicial do Fórum" seleciona Página HTML.

Cumprimentos!

Edição: Consegui fazer uma página HTML até que razoável, segue o código.
Código:
               <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />               <link type="image/x-icon" href="http://i46.servimg.com/u/f46/16/56/73/62/animat11.gif" rel="shortcut icon" />               <title>  -Início  </title>               <style type="text/css">
      
        body,td,th {
      
          font-family: Tahoma, Geneva, sans-serif;
      
          font-size: 14px;
      
          color: #000;
      
          text-shadow: 0px 0px 1px #999;
      
        }
      
        body {
      
          background-color:#1F1F1F;
      
          background-image: url(http://i59.tinypic.com/23kuk9d.jpg);
      
          margin-left: 0px;
      
          margin-top: 0px;
      
          margin-right: 0px;
      
          margin-bottom: 0px;
      
          background-repeat: repeat;
      
          background-attachment:fixed;
      
        }
      
        a {
      
          font-size: 12px;
      
          color: #06C;
      
        }
      
        a:link {
      
          text-decoration: none;
      
        }
      
        a:visited {
      
          text-decoration: none;
      
          color: #06C;
      
        }
      
        a:hover {
      
          text-decoration: none;
      
          color: #39F;
      
        }
      
        a:active {
      
          text-decoration: none;
      
          color: #06C;
      
        }
      
        #box-top {
      
          background-color:#f4f4f4;
      
          border:3px #c1c1c1 solid;
      
          margin-top:50px;
      
          border-top-left-radius:8px;
      
          -moz-border-radius-topleft:8px;
      
          border-top-right-radius:8px;
      
          -moz-border-radius-topright:8px;
      
          padding: 15px;
      
          box-shadow: 2px 2px 2px #333;
      
          -webkit-box-shadow: 2px 2px 2px #333;
      
          -moz-box-shadow: 2px 2px 2px #333;
      
        }
      
        #box-meio {
      
          background-color:#f4f4f4;
      
          border:3px #c1c1c1 solid;
      
          margin-top:10px;
      
          padding-top: 5px;
      
          padding-bottom: 5px;
      
          padding-left: 18px;
      
          padding-right: 18px;
      
          box-shadow: 2px 2px 2px #333;
      
          -webkit-box-shadow: 2px 2px 2px #333;
      
          -moz-box-shadow: 2px 2px 2px #333;
      
        }
      
        #box-bottom {
      
          background-color:#f4f4f4;
      
          border:3px #c1c1c1 solid;
      
          margin-top:10px;
      
          margin-bottom:20px;
      
          border-bottom-left-radius:8px;
      
          -moz-border-radius-bottomleft:8px;
      
          border-bottom-right-radius:8px;
      
          -moz-border-radius-bottomright:8px;
      
          padding: 5px 5px 5px 5px;
      
          box-shadow: 2px 2px 2px #333;
      
          -webkit-box-shadow: 2px 2px 2px #333;
      
          -moz-box-shadow: 2px 2px 2px #333;
      
        }
      
       #banner {
      
          width:515px;
      
          height:79px;
      
       background-image:url(http://i.imgur.com/aaNjQ28.png);
       background-repeat:no-repeat;
       background-position:left;
<br>

      
          background-repeat:no-repeat;
      
        }
      
        #border-xat{
      
          padding:1px;
      
          border:3px #06C solid;
      
          box-shadow: 0px 0px 2px #333;
      
          -webkit-box-shadow: 0px 0px 2px #333;
      
          -moz-box-shadow: 0px 0px 2px #333;
      
        }
      
        .h2 {
      
          color: #06C;
      
          text-shadow: 0px 0px 1px #666;
      
        }
      
        .h3 {
      
          font-size:11px;
      
          color:#999;
      
        }
      
        </style>                                                      
<table style="width: 700px;" id="box-top" cellspacing="0" cellpadding="0" align="center" border="0">
                   
   <tbody>
      <tr>
                           
         <td class="h22" align="left">
            <table style="width: 800px;" cellspacing="0" cellpadding="0" align="left" border="0">
                                   
               <tbody>
                  <tr>
                                           
                     <td id="banner">
                     </td>
                                           
                     <td align="center">
                        <h1 class="h2">
                        </h1>
                     </td>
                                         
                  </tr>
                                    
               </tbody>
            </table>
         </td>
                         
      </tr>
                    
   </tbody>
</table>
              
<table style="width: 800px;" id="box-meio" cellspacing="0" cellpadding="0" align="center" border="0">
                   
   <tbody>
      <tr>
                           
         <td class="h22" align="left">
            <p>
               <center>Bem-vindo ao fórum!</center>
            </p>
                                               <br />
            <center>
               <script type="text/javascript"><!--
      
        google_ad_client = "pub-3532459646744559";
      
        /* 728x90, criado 23/04/11 */
      
        google_ad_slot = "0063342042";
      
        google_ad_width = 800;
      
        google_ad_height = 90;
      
        //-->
      
        </script>               <script src="" type="text/javascript">
      
      
      
        </script>              
            </center>
            <table style="width: 800px;" cellspacing="0" cellpadding="0" align="center" border="0">
                                   
               <tbody>
                  <tr>
                                           
                     <td align="center">
                        <h2 class="h2">
                           <a href="http://clinicacior.forumeiros.com/forum" title="Clique aqui para entrar no fórum." "=""><img border="0" src="http://i49.servimg.com/u/f49/16/79/58/45/entrar15.png" /></a>               <a href="http://clinicacior.forumeiros.com/register" title="Clique aqui para se cadastrar." "=""><img border="0" src="http://i49.servimg.com/u/f49/16/79/58/45/cadast10.png" /></a>                         <br />                      
                        </h2>
                     </td>
                                         
                  </tr>
                                      
                  <tr>
                                                                   
                  </tr>
                                    
               </tbody>
            </table>
                              
            <p>
               
            </p>
         </td>
                         
      </tr>
                    
   </tbody>
</table>
              
<table style="width: 800px;" id="box-bottom" cellspacing="0" cellpadding="0" align="center" border="0">
                   
   <tbody>
      <tr>
                           
         <td style="width: 800px;" class="h3" align="left">
            <center><IMG SRC="http://i58.tinypic.com/29pum3l.png"></center>
         </td>
      </tr>
   </tbody>
</table>

Confira se lhe agrada Feliz aniversário
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 08/07/15, 03:14 pm

Sim, mas existe algum lugar onde eu possa pedir uma página em html? Porque das ultimas vezes eu pedi nesse tópico e foram antedidos.


EDIT: Voce colocou menu e outras configurações, eu queria mesmo só a imagem ocupando todo o fundo e os botões.
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Fraise em 08/07/15, 03:24 pm

@kakakoro escreveu:Sim, mas existe algum lugar onde eu possa pedir uma página em html? Porque das ultimas vezes eu pedi nesse tópico e foram antedidos.


EDIT: Voce colocou menu e outras configurações, eu queria mesmo só  a imagem ocupando todo o fundo e os botões.
Olá @kakakoro!

Para não aparecer o menu e outras configurações, aceda a:
Painel de Controle ->> Módulos ->> Gestão das páginas HTML

Clique em Editar na página que criou e em "Você deseja utilizar o início e o final da página do seu fórum ?" selecione Não.

Cumprimentos!
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 09/07/15, 09:25 am

Oi, dá pra deixar os botões iguais ao desse fórum? Com a imagem esticado para não repetir e sem aquela logo estranha?

http://vertigem.forumeiros.com/
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Fraise em 09/07/15, 09:38 am

Olá @kakakoro!

Será isto?
Código:
<br /><meta http-equiv="Content-Type" content="text/html;charset=utf-8" />                          <style>
        <!----------------------------------------------- Créditos: -----------------------------------------------!>
        Está página foi desenvolvida por BrunoH. - Web Designer e Programador
        Nome: BrunoH. Páginas HTML
        Autor: BrunoH.
        Link: http://brunohweb.tk/
        Data: 11/07/2013
        A Copia desta página sem autorização do autor, poderá ser processado pois a página contem direitos autorais reservados!
        <!-------------------------------- Não retire os créditos - @copyright 2013 -------------------------------!>








        hr {
        border-color: #fff;
        }
        #top5 {
        display:none;
        position: fixed;
        left: 86.6%;
        top: 97%;
        color: #73AAFD;
        font-family: "Courier New", Courier, monospace font-size:14px;
        font-weight: bold;
        text-shadow: black 0.15em 0.15em 0.2em;
        opacity: 0.7;
        -webkit-transition-duration: 1s;
        background: rgb(27, 27, 27);
        width: 20%;
        -webkit-box-shadow: rgb(255, 255, 255) 1px 1px 6px;
        }
        #top5:hover {
        height: 80%;
        top: 47%;
        opacity: 1;
        }
        #topo1 {
        position: absolute;
        left: 81%;
        top: 1.5%;
        color: rgb(211, 211, 211);
        font-weight: bold;
        text-shadow: black 0.15em 0.15em 0.2em;
        -webkit-transition-duration: 1s;
        }
        #topo2ip {
        color: rgb(214, 214, 214);
        display: inline;
        }
        #topo2 {
        position: absolute;
        top: 0%;
        color: #73AAFD;
        font-weight: bold;
        text-shadow: black 0.15em 0.15em 0.2em;
        background: transparent;
        width: 98%;
        -webkit-transition-duration: 1s;
        border-bottom: 1px solid rgba(255, 255, 255, 0.53);
        padding: 4px;
        }
        #RaidCallDESATIVADO {
        position: absolute;
        top: 1.5%;
        color: #73AAFD;
        font-weight: bold;
        text-shadow: black 0.15em 0.15em 0.2em;
        background: transparent;
        width: 36%;
        -webkit-transition-duration: 1s;
        margin-left: 22%;
        }
        #RaidCall {
        position: absolute;
        left: 81%;
        top: 0%;
        color: #73AAFD;
        font-weight: bold;
        text-shadow: black 0.15em 0.15em 0.2em;
        -webkit-transition-duration: 1s;
        padding: 4px;
        }
        #RaidCallID {
        color: rgb(214, 214, 214);
        display: inline;
        }
        #topo2:hover {opacity: 1;}
        #cssmenu ul,
        #cssmenu li,
        #cssmenu span,
        #cssmenu a {
          margin: 0;
          padding: 0;
          position: relative;
        }
        #cssmenu {
        height: 49px;
        background: transparent;
        margin-left: 80%;
        margin-top: -10%;
        width: 17%!important;
        }
        #cssmenu:after,
        #cssmenu ul:after {
          content: '';
          display: block;
          clear: both;
        }
        #cssmenu a {
        background: transparent;
        color: #fff;
        display: inline-block;
        font-family: Game of Thrones;
        line-height: 35px;
        padding: 0 20px;
        text-decoration: none;
        border-radius: 3px;
        font-size: 20px;
        margin-left: 5px;
        }
        #cssmenu ul {
          list-style: none;
        }
        #cssmenu > ul {
          float: left;
        }
        #cssmenu > ul > li {
          float: center;
        }
        #cssmenu > ul > li:hover:after {
          content: '';
          display: block;
          width: 0;
          height: 0;
          position: absolute;
          left: 50%;
          bottom: 0;
        }
        #cssmenu > ul > li:hover > a {
        color: rgba(255, 255, 255, 0.55);
        }
        #cssmenu .has-sub {
          z-index: 1;
        }
        #cssmenu .has-sub:hover > ul {
          display: block;
        }
        #cssmenu .has-sub ul {
          display: none;
          position: absolute;
          width: 200px;
          top: 100%;
          left: 0;
        }
        #cssmenu .has-sub ul li {
          *margin-bottom: -1px;
        }
        #cssmenu .has-sub ul li a {
          background: #0fa1e0;
          border-bottom: 1px dotted #6fc7ec;
          filter: none;
          font-size: 11px;
          display: block;
          line-height: 120%;
          padding: 10px;
        }
        #cssmenu .has-sub ul li:hover a {
          background: #0c7fb0;
        }
        #cssmenu .has-sub .has-sub:hover > ul {
          display: block;
        }
        #cssmenu .has-sub .has-sub ul {
          display: none;
          position: absolute;
          left: 100%;
          top: 0;
        }
        #cssmenu .has-sub .has-sub ul li a {
          background: #0c7fb0;
          border-bottom: 1px dotted #6db2d0;
        }
        #cssmenu .has-sub .has-sub ul li a:hover {
          background: #095c80;
        }
        .menu {
        width: 87.2%;
        background: transparent;
        margin-top: 4%;
        position: absolute;
        margin-left: 5%;
        padding: 10px;
        -webkit-border-radius: 7px 7px 0px 0;
        color:#fff;
        }
        .menu a{
        transition:all linear 0.5s;
        -moz-transition:all linear 0.5s;
        -webkit-moz-trasition:all linear 0.5s;
        font-weight:bold;
        color:#999999;
        margin-right:35px;
        text-decoration:none;
        }
        #tabela1 {
        background: transparent;
        width: 1%;
        float: center;
        height: 1%;
        margin-top: 383px;
        }
        #tabela1 a{
        text-decoration:none;
        color:#000;
        }
        body{
        background: rgb(0, 0, 0) url("http://i59.tinypic.com/23kuk9d.jpg") repeat;
        color: #5a5a5a;
        font: normal 11px tahoma,helvetica,arial,sans-serif;
        padding-bottom: 20px;
        background-repeat: no-repeat;
      background-size: 100pc;
        }
        .conectado {
        margin-top: -2.9%;
        margin-left: 6%;
        position: absolute;
        background: rgba(0, 0, 0, 0.18);
        height: 37px;
        box-shadow: inset rgba(255, 255, 255, 0.25) 0px 0px 0px 1px;
        -webkit-box-shadow: inset rgba(255, 255, 255, 0.25) 0px 0px 0px 1px;
        border: 1px solid rgba(0, 0, 0, 0.35);
        width: 87%;
        }
        .botao {
        font-weight: bold;
        color: white;
        float: left;
        padding: 0 13px 9px 13px;
        line-height: 36px;
        outline: none;
        height: 26px;
        text-decoration: none;
        }
        .botao a {
        color: white;
        text-decoration: none;
        }
        .botao:hover {
        background: rgba(0, 0, 0, 0.1);
        }
        #brunoh {
        background-color: #fbfbfb;
        border: 1px solid rgb(231, 231, 231);
        padding: 6px;
        }
        .redesociais {
        margin-left: 820px;
        margin-top: -288px;
        position: absolute;
        }
      #tabcont-brunoh {
padding: 10px;
width: 600px;
position: absolute;
margin-left: 100px;
background: rgba(0, 0, 0, 0.4);
z-index: 1;
min-height: 100px;
margin-top: -237px;
color: white;
border-radius: 10px;
left: 22pc;
}
        .copyright {
        position: absolute;
        margin-left: 600px;
        margin-top: 264px;
        color: #fff;
        }


div#soufoda {
position: relative;
left: -39pc;
top: 9pc;
-webkit-transition: background-color 0.5s;
transition: background-color 0.5s;
background-color: rgba(139, 139, 139, 0.360784);
border-color: rgba(0, 0, 0, 0.188235);
border-radius: 6px;
border-style: solid;
border-width: 1px 1px 3px;
box-shadow: rgba(66, 66, 66, 0.760784) 0px 0px 2px inset;
color: rgb(249, 249, 249);
display: block;
font-size: 14px;
font-weight: 700;
padding: 3px 6px;
text-align: center;
text-shadow: rgba(0, 0, 0, 0.2) 0px -1px 0px;
width: 19pc;
height: 123px;
}
div#sennior1:hover {
background-color: rgb(63, 63, 63);
padding: 6px;
}
div#sennior2:hover {
background-color: rgb(63, 63, 63);
padding-bottom: 11px;
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
position: relative;
left: -623px;
}
div#sennior:hover {
background-color: rgb(63, 63, 63);
padding: 6px;
}
div#sennior1 {
position: relative;
top: 13px;
-moz-transition: background-color .5s;
-o-transition: background-color .5s;
-webkit-transition: background-color .5s;
border-color: transparent;
border-width: 1px 1px 3px;
color: #F9F9F9;
display: block;
font-size: 14px;
font-weight: 700;
padding: 3px 6px;
text-align: center;
text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
transition: background-color .5s;
width: 19pc;
left: -39pc;
}
div#sennior4:hover {
background-color: rgb(63, 63, 63);
padding: 6px;
}
div#sennior4 {
position: relative;
top: 13px;
-moz-transition: background-color .5s;
-o-transition: background-color .5s;
-webkit-transition: background-color .5s;
border-color: transparent;
border-width: 1px 1px 3px;
color: #F9F9F9;
display: block;
font-size: 14px;
font-weight: 700;
padding: 3px 6px;
text-align: center;
text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
transition: background-color .5s;
width: 19pc;
left: -39pc;
}
div#sennior2 {
position: relative;
top: 13px;
-moz-transition: background-color .5s;
-o-transition: background-color .5s;
-webkit-transition: background-color .5s;
border-width: 1px 1px 3px;
color: #F9F9F9;
display: block;
font-size: 14px;
font-weight: 700;
padding: 3px 6px;
text-align: center;
text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
transition: background-color .5s;
width: 19pc;
left: -39pc;
}
        </style>
<center>
                               <link rel="shortcut icon" type="image/x-icon" href="http://gameofthrones-845.ah.bpcdn.net/favicon.ico?" />        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />        <title>Vertigem</title>                                           
   <div class="redesociais">
                              <iframe allowtransparency="true" style="border:none; overflow:hidden; width:300px; height:50pxpx;" frameborder="0" scrolling="no" src="//www.facebook.com/plugins/facepile.php?app_id&href=https%3A%2F%2Fwww.facebook.com%2Fpages%2FVertigem%2F565104080290317%3Ffref%3Dts&action&width=300&height=50px&max_rows=1&colorscheme=light&size=medium&show_count=true"></iframe>       
   </div>
                                                  
   <center>
                              <img src="http://i58.tinypic.com/29pum3l.png" style=" position: absolute; left: 435px; top: -20px;padding: 0px; width: 40%;" />                       
      <div id="tabcont-brunoh">
                                                                      
         <div id="tab1" style="font-size:13px; color:#CFCFCF; display: block;">
                                                                                     
            <ul>
                                                       Bem-vindo ao fórum!                   
            </ul>
                                                                               
         </div>
                                                                          
      </div>
                                                 
   </center>
                                                  
   <center>
                                                       
      <div class="menu">
                                                                      
         <div id="cssmenu">
                                                                                                 
            <center>
                                                                                                    
               <div id="Soufoda">
                                                                       
               </div>
                                                                    
               <div id="sennior4">
                                                                                                                   
                  <div id="tab1" style="display: block; color:#CFCFCF;">
                                                                                                                                  
                     <ul>
                                                                                    <a href="/login">Login</a>                                                     
                     </ul>
                                                                                                                            
                  </div>
                                                                                                   
               </div>
                                                                                          
               <div id="sennior1">
                                                                                                                         
                  <div id="tab1" style="display: block;">
                                                                                                                                        
                     <ul>
                                                                                        <a href="/register">Registro</a>                                                         
                     </ul>
                                                                                                                                  
                  </div>
                                                                                                     
               </div>
                                                                                            
               <div id="sennior2">
                                                                                                                               
                  <div id="tab1" style="display: block;">
                                                                                                                                              
                     <ul>
<a href="/forum">Fórum</a>                                                           
                     </ul>
                                                                                                                                        
                  </div>
                                                                                                                           
               </div>
                                                                                                                            
            </center>
                                                                               
         </div>
                                                                                  
      </div>
                                                       
      <div class="copyright">
                                       Copyright ® CJSilveira Isoul Renato Vasconcelos                         
      </div>
                                                                 
      <table id="tabela1">
                                                                                
         <tbody>
                                                                                     
            <tr>
                                                                                                    
               <td>
                                                                                                                   
                  <center>
                                                                                                                            
                  </center>
                                                                                                             
               </td>
                                                                                              
            </tr>
                                                                               
         </tbody>
                                                                
      </table>
                                                 
   </center>
                               <a href="http://www.forumeiros.com" target="_blank" style="display: none;"> Fórumeiros</a>
</center>

Cumprimentos!
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 09/07/15, 10:16 am

É isso, mas a pagina está desconfigurada. Vou por como página inicial para que voce veja. De qualquer forma, se não puder me ajudar editando a página, já ajudou bastante criando-a. Brigado!
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Fraise em 09/07/15, 10:27 am

@kakaroto

O que o senhor deseja que seja alterado?

Cumprimentos!
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 09/07/15, 10:49 am

Mas, meu nome não é Kakaroto, haha.

Deixando as brincadeiras de lado, precisaria que :


1 - A imagem não está grande o suficiente, está ficando uma parte preta no final. Tem como esticá-la até caber ou seria melhor fazer outra imagem maior?

2 - Colocar a imagem do cabeçalho no rodapé, assim como no fórum.

3 - Configurar o campo onde está escrito a descrição da clinica e deixar em um canto, ou num lugar onde não fique no rosto das pessoas.

4 - Colocar um efeito mais estético nos botões? Algo menor, talvez com a letra em outra fonte, a fonte também um pouco menor.


5 - Voce arrasa! Envergonhado Rosa
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Fraise em 09/07/15, 11:36 am

Olá!

Perdão por me ter enganado em seu nickname Envergonhado

Quanto ao seu pedido, irei precisar de uma imagem que ocupe a página toda se possível.

Cumprimentos!
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 09/07/15, 01:52 pm

Pronto, alterei a imagem. Agora falta organizar os outros itens. O que achou?
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Fraise em 09/07/15, 03:18 pm

Olá!

Verifique se lhe agrada agora zen
Código:

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />                          <style>
        <!----------------------------------------------- Créditos: -----------------------------------------------!>
        Está página foi desenvolvida por BrunoH. - Web Designer e Programador
        Nome: BrunoH. Páginas HTML
        Autor: BrunoH.
        Link: http://brunohweb.tk/
        Data: 11/07/2013
        A Copia desta página sem autorização do autor, poderá ser processado pois a página contem direitos autorais reservados!
        <!-------------------------------- Não retire os créditos - @copyright 2013 -------------------------------!>








        hr {
        border-color: #fff;
        }
        #top5 {
        display:none;
        position: fixed;
        left: 86.6%;
        top: 97%;
        color: #73AAFD;
        font-family: "Courier New", Courier, monospace font-size:14px;
        font-weight: bold;
        text-shadow: black 0.15em 0.15em 0.2em;
        opacity: 0.7;
        -webkit-transition-duration: 1s;
        background: rgb(27, 27, 27);
        width: 20%;
        -webkit-box-shadow: rgb(255, 255, 255) 1px 1px 6px;
        }
        #top5:hover {
        height: 80%;
        top: 47%;
        opacity: 1;
        }
        #topo1 {
        position: absolute;
        left: 81%;
        top: 1.5%;
        color: rgb(211, 211, 211);
        font-weight: bold;
        text-shadow: black 0.15em 0.15em 0.2em;
        -webkit-transition-duration: 1s;
        }
        #topo2ip {
        color: rgb(214, 214, 214);
        display: inline;
        }
        #topo2 {
        position: absolute;
        top: 0%;
        color: #73AAFD;
        font-weight: bold;
        text-shadow: black 0.15em 0.15em 0.2em;
        background: transparent;
        width: 98%;
        -webkit-transition-duration: 1s;
        border-bottom: 1px solid rgba(255, 255, 255, 0.53);
        padding: 4px;
        }
        #RaidCallDESATIVADO {
        position: absolute;
        top: 1.5%;
        color: #73AAFD;
        font-weight: bold;
        text-shadow: black 0.15em 0.15em 0.2em;
        background: transparent;
        width: 36%;
        -webkit-transition-duration: 1s;
        margin-left: 22%;
        }
        #RaidCall {
        position: absolute;
        left: 81%;
        top: 0%;
        color: #73AAFD;
        font-weight: bold;
        text-shadow: black 0.15em 0.15em 0.2em;
        -webkit-transition-duration: 1s;
        padding: 4px;
        }
        #RaidCallID {
        color: rgb(214, 214, 214);
        display: inline;
        }
        #topo2:hover {opacity: 1;}
        #cssmenu ul,
        #cssmenu li,
        #cssmenu span,
        #cssmenu a {
          margin: 0;
          padding: 0;
          position: relative;
        }
        #cssmenu {
        height: 49px;
        background: transparent;
        margin-left: 80%;
        margin-top: -10%;
        width: 17%!important;
        }
        #cssmenu:after,
        #cssmenu ul:after {
          content: '';
          display: block;
          clear: both;
        }
        #cssmenu a {
        background: transparent;
        color: #fff;
        display: inline-block;
        font-family: Game of Thrones;
        line-height: 35px;
        padding: 0 20px;
        text-decoration: none;
        border-radius: 3px;
        font-size: 20px;
        margin-left: 5px;
        }
        #cssmenu ul {
          list-style: none;
        }
        #cssmenu > ul {
          float: left;
        }
        #cssmenu > ul > li {
          float: center;
        }
        #cssmenu > ul > li:hover:after {
          content: '';
          display: block;
          width: 0;
          height: 0;
          position: absolute;
          left: 50%;
          bottom: 0;
        }
        #cssmenu > ul > li:hover > a {
        color: rgba(255, 255, 255, 0.55);
        }
        #cssmenu .has-sub {
          z-index: 1;
        }
        #cssmenu .has-sub:hover > ul {
          display: block;
        }
        #cssmenu .has-sub ul {
          display: none;
          position: absolute;
          width: 200px;
          top: 100%;
          left: 0;
        }
        #cssmenu .has-sub ul li {
          *margin-bottom: -1px;
        }
        #cssmenu .has-sub ul li a {
          background: #0fa1e0;
          border-bottom: 1px dotted #6fc7ec;
          filter: none;
          font-size: 11px;
          display: block;
          line-height: 120%;
          padding: 10px;
        }
        #cssmenu .has-sub ul li:hover a {
          background: #0c7fb0;
        }
        #cssmenu .has-sub .has-sub:hover > ul {
          display: block;
        }
        #cssmenu .has-sub .has-sub ul {
          display: none;
          position: absolute;
          left: 100%;
          top: 0;
        }
        #cssmenu .has-sub .has-sub ul li a {
          background: #0c7fb0;
          border-bottom: 1px dotted #6db2d0;
        }
        #cssmenu .has-sub .has-sub ul li a:hover {
          background: #095c80;
        }
        .menu {
        width: 87.2%;
        background: transparent;
        margin-top: 4%;
        position: absolute;
        margin-left: 5%;
        padding: 10px;
        -webkit-border-radius: 7px 7px 0px 0;
        color:#fff;
        }
        .menu a{
        transition:all linear 0.5s;
        -moz-transition:all linear 0.5s;
        -webkit-moz-trasition:all linear 0.5s;
        font-weight:bold;
        color:#999999;
        margin-right:35px;
        text-decoration:none;
        }
        #tabela1 {
        background: transparent;
        width: 1%;
        float: center;
        height: 1%;
        margin-top: 383px;
        }
        #tabela1 a{
        text-decoration:none;
        color:#000;
        }
        body{
        background: rgb(0, 0, 0) url("http://images.forwallpaper.com/files/images/4/45d9/45d90ca4/314285/green-white-thread.jpg") no-repeat;
        color: #5a5a5a;
        font: normal 11px tahoma,helvetica,arial,sans-serif;
        padding-bottom: 20px;
        background-repeat: no-repeat;
      background-size: 100pc;
        }
        .conectado {
        margin-top: -2.9%;
        margin-left: 6%;
        position: absolute;
        background: rgba(0, 0, 0, 0.18);
        height: 37px;
        box-shadow: inset rgba(255, 255, 255, 0.25) 0px 0px 0px 1px;
        -webkit-box-shadow: inset rgba(255, 255, 255, 0.25) 0px 0px 0px 1px;
        border: 1px solid rgba(0, 0, 0, 0.35);
        width: 87%;
        }
        .botao {
        font-weight: bold;
        color: white;
        float: left;
        padding: 0 13px 9px 13px;
        line-height: 36px;
        outline: none;
        height: 26px;
        text-decoration: none;
        }
        .botao a {
        color: white;
        text-decoration: none;
        }
        .botao:hover {
        background: rgba(0, 0, 0, 0.1);
        }
        #brunoh {
        background-color: #fbfbfb;
        border: 1px solid rgb(231, 231, 231);
        padding: 6px;
        }
        .redesociais {
        margin-left: 820px;
        margin-top: -288px;
        position: absolute;
        }
      #tabcont-brunoh {
padding: 10px;
width: 600px;
position: absolute;
margin-left: 100px;
background: rgba(0, 0, 0, 0.4);
z-index: 1;
min-height: 100px;
margin-top: -237px;
color: white;
border-radius: 10px;
left: 22pc;
}
        .copyright {
        position: absolute;
        margin-left: 600px;
        margin-top: 264px;
        color: #fff;
        }


div#soufoda {
position: relative;
left: -39pc;
top: 9pc;
-webkit-transition: background-color 0.5s;
transition: background-color 0.5s;
background-color: rgba(139, 139, 139, 0.360784);
border-color: rgba(0, 0, 0, 0.188235);
border-radius: 6px;
border-style: solid;
border-width: 1px 1px 3px;
box-shadow: rgba(66, 66, 66, 0.760784) 0px 0px 2px inset;
color: rgb(249, 249, 249);
display: block;
font-size: 14px;
font-weight: 700;
padding: 3px 6px;
text-align: center;
text-shadow: rgba(0, 0, 0, 0.2) 0px -1px 0px;
width: 19pc;
height: 123px;
}
div#sennior1:hover {
background-color: rgb(63, 63, 63);
padding: 6px;
}
div#sennior2:hover {
background-color: rgb(63, 63, 63);
padding-bottom: 11px;
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
position: relative;
left: -623px;
}
div#sennior:hover {
background-color: rgb(63, 63, 63);
padding: 6px;
}
div#sennior1 {
position: relative;
top: 13px;
-moz-transition: background-color .5s;
-o-transition: background-color .5s;
-webkit-transition: background-color .5s;
border-color: transparent;
border-width: 1px 1px 3px;
color: #F9F9F9;
display: block;
font-size: 14px;
font-weight: 700;
padding: 3px 6px;
text-align: center;
text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
transition: background-color .5s;
width: 19pc;
left: -39pc;
}
div#sennior4:hover {
background-color: rgb(63, 63, 63);
padding: 6px;
}
div#sennior4 {
position: relative;
top: 13px;
-moz-transition: background-color .5s;
-o-transition: background-color .5s;
-webkit-transition: background-color .5s;
border-color: transparent;
border-width: 1px 1px 3px;
color: #F9F9F9;
display: block;
font-size: 14px;
font-weight: 700;
padding: 3px 6px;
text-align: center;
text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
transition: background-color .5s;
width: 19pc;
left: -39pc;
}
div#sennior2 {
position: relative;
top: 13px;
-moz-transition: background-color .5s;
-o-transition: background-color .5s;
-webkit-transition: background-color .5s;
border-width: 1px 1px 3px;
color: #F9F9F9;
display: block;
font-size: 14px;
font-weight: 700;
padding: 3px 6px;
text-align: center;
text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
transition: background-color .5s;
width: 19pc;
left: -39pc;
}
        </style>
<center>
                              <link rel="shortcut icon" type="image/x-icon" href="http://gameofthrones-845.ah.bpcdn.net/favicon.ico?" />        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />        <title>Vertigem</title>                                           
  <div class="redesociais">
                              <iframe allowtransparency="true" style="border:none; overflow:hidden; width:200px; height:200px;" frameborder="0" scrolling="no" src="//www.facebook.com/plugins/facepile.php?app_id&href=https%3A%2F%2Fwww.facebook.com%2Fpages%2FVertigem%2F565104080290317%3Ffref%3Dts&action&width=300&height=50px&max_rows=1&colorscheme=light&size=medium&show_count=true"></iframe>       
  </div>
                                                 
  <center>
                                                     
      <div id="tabcont-brunoh">
                                                                     
        <div id="tab1" style="font-size:13px; color:#CFCFCF; display: block;">
                                                                                     
            <ul>
                                                      A Clinica Cior está há mais de cinco anos no mercado odontológico, com profissionais especializados e equipamentos de última geração. Cior, um sorriso muda tudo.                 
            </ul>
                                                                               
        </div>
                                                                         
      </div>
                                                 
  </center>
                                                 
  <center>
                                                       
      <div class="menu">
                                                                     
        <div id="cssmenu">
                                                                                                 
            <center>
                                                                                                   
              <div id="Soufoda">
                                                                       
              </div>
                                                                   
              <div id="sennior4">

                                                                                                                   
                  <div id="tab1" style="display: block; color:#CFCFCF;">
                                                                                                                                 
                    <ul>
                                                                                    <a href="/login">Login</a>                                                     
                    </ul>
                                                                                                                           
                  </div>
                                                                                                   
              </div>
                                                                                         
              <div id="sennior1">
                                                                                                                         
                  <div id="tab1" style="display: block;">
                                                                                                                                       
                    <ul>
                                                                                        <a href="/register">Registro</a>                                                         
                    </ul>
                                                                                                                                 
                  </div>
                                                                                                     
              </div>
                                                                                           
              <div id="sennior2">
                                                                                                                               
                  <div id="tab1" style="display: block;">
                                                                                                                                             
                    <ul>
<a href="/forum">Cior Odontologia</a>   
                    </ul>
                               

                  </div>
                                                                                                                           
              </div>
                                                                                                                           
            </center>
                                                                               
        </div>
                                                                                 
      </div>
                                                       
      <div class="copyright">
Copyright ® Criação de BrunoH. / Edição por Fraise, Carlos Silveira em parceria com a clínica Cior Odontologia.                 
      <br><img src="http://i58.tinypic.com/29pum3l.png" style=" position: absolute; left: 200px; top: -20px;padding: 0px; width: 45%;" />
</div>

                                                                 
      <table id="tabela1">
                                                                               
        <tbody>
                                                                                     
            <tr>
                                                                                                   
              <td>
                                                                                                                   
                  <center>
                                                                                                                           
                  </center>
                                                                                                             
              </td>
                                                                                             
            </tr>
                                                                               
        </tbody>
                                                               
      </table>
                                                 
  </center>
                              <a href="http://www.forumeiros.com" target="_blank" style="display: none;"> Fórumeiros</a>
</center>

Deseja mais alguma alteração?

Atenciosamente.
Fraise
avatar

Fraise
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/06/2015
Mensagens : 5034
Pontos Ativos : 6714

Ver perfil do usuário http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 09/07/15, 03:55 pm

Pode centralizar o rodapé, com tamanho de 80%px, deixar o campo de texto e o menu com a mesma transparência? Muito feliz
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Rafael em 11/07/15, 02:12 pm

Olá!

Antes de tudo, venho lhe dizer que esta página está contra as disposições gerais do Forumeiros ao utilizar este código desta forma:
Código:
<a href="http://www.forumeiros.com" target="_blank" style="display: none;"> Fórumeiros</a>




Quanto a pagina troque por esta e veja:

Código:

    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />                          <style>
            <!----------------------------------------------- Créditos: -----------------------------------------------!>
            Está página foi desenvolvida por BrunoH. - Web Designer e Programador
            Nome: BrunoH. Páginas HTML
            Autor: BrunoH.
            Link: http://brunohweb.tk/
            Data: 11/07/2013
            A Copia desta página sem autorização do autor, poderá ser processado pois a página contem direitos autorais reservados!
            <!-------------------------------- Não retire os créditos - @copyright 2013 -------------------------------!>








            hr {
            border-color: #fff;
            }
            #top5 {
            display:none;
            position: fixed;
            left: 86.6%;
            top: 97%;
            color: #73AAFD;
            font-family: "Courier New", Courier, monospace font-size:14px;
            font-weight: bold;
            text-shadow: black 0.15em 0.15em 0.2em;
            opacity: 0.7;
            -webkit-transition-duration: 1s;
            background: rgb(27, 27, 27);
            width: 20%;
            -webkit-box-shadow: rgb(255, 255, 255) 1px 1px 6px;
            }
            #top5:hover {
            height: 80%;
            top: 47%;
            opacity: 1;
            }
            #topo1 {
            position: absolute;
            left: 81%;
            top: 1.5%;
            color: rgb(211, 211, 211);
            font-weight: bold;
            text-shadow: black 0.15em 0.15em 0.2em;
            -webkit-transition-duration: 1s;
            }
            #topo2ip {
            color: rgb(214, 214, 214);
            display: inline;
            }
            #topo2 {
            position: absolute;
            top: 0%;
            color: #73AAFD;
            font-weight: bold;
            text-shadow: black 0.15em 0.15em 0.2em;
            background: transparent;
            width: 98%;
            -webkit-transition-duration: 1s;
            border-bottom: 1px solid rgba(255, 255, 255, 0.53);
            padding: 4px;
            }
            #topo2:hover {opacity: 1;}
            #cssmenu ul,
            #cssmenu li,
            #cssmenu span,
            #cssmenu a {
              margin: 0;
              padding: 0;
              position: relative;
            }
            #cssmenu {
            height: 49px;
            background: transparent;
            margin-left: 80%;
            margin-top: -10%;
            width: 17%!important;
            }
            #cssmenu:after,
            #cssmenu ul:after {
              content: '';
              display: block;
              clear: both;
            }
            #cssmenu a {
    background: transparent none repeat scroll 0% 0%;
    color: rgb(185, 185, 185);
    display: inline-block;
    line-height: 35px;
    padding: 0px 20px;
    text-decoration: none;
    border-radius: 3px;
    font-size: 19px;
    margin-left: 5px;
    font-weight: 100 !important;
}
            #cssmenu ul {
              list-style: none;
            }
            #cssmenu > ul {
              float: left;
            }
            #cssmenu > ul > li {
              float: center;
            }
            #cssmenu > ul > li:hover:after {
              content: '';
              display: block;
              width: 0;
              height: 0;
              position: absolute;
              left: 50%;
              bottom: 0;
            }
            #cssmenu > ul > li:hover > a {
            color: rgba(255, 255, 255, 0.55);
            }
            #cssmenu .has-sub {
              z-index: 1;
            }
            #cssmenu .has-sub:hover > ul {
              display: block;
            }
            #cssmenu .has-sub ul {
              display: none;
              position: absolute;
              width: 200px;
              top: 100%;
              left: 0;
            }
            #cssmenu .has-sub ul li {
              *margin-bottom: -1px;
            }
            #cssmenu .has-sub ul li a {
              background: #0fa1e0;
              border-bottom: 1px dotted #6fc7ec;
              filter: none;
              font-size: 11px;
              display: block;
              line-height: 120%;
              padding: 10px;
            }
            #cssmenu .has-sub ul li:hover a {
              background: #0c7fb0;
            }
            #cssmenu .has-sub .has-sub:hover > ul {
              display: block;
            }
            #cssmenu .has-sub .has-sub ul {
              display: none;
              position: absolute;
              left: 100%;
              top: 0;
            }
            #cssmenu .has-sub .has-sub ul li a {
              background: #0c7fb0;
              border-bottom: 1px dotted #6db2d0;
            }
            #cssmenu .has-sub .has-sub ul li a:hover {
              background: #095c80;
            }
            .menu {
            width: 87.2%;
            background: transparent;
            margin-top: 4%;
            margin-left: 5%;
            padding: 10px;
            -webkit-border-radius: 7px 7px 0px 0;
            color:#fff;
            }
            .menu a{
            transition:all linear 0.5s;
            -moz-transition:all linear 0.5s;
            -webkit-moz-trasition:all linear 0.5s;
            font-weight:bold;
            color:#999999;
            margin-right:35px;
            text-decoration:none;
            }
            #tabela1 {
            background: transparent;
            width: 1%;
            float: center;
            height: 1%;
            margin-top: 383px;
            }
            #tabela1 a{
            text-decoration:none;
            color:#000;
            }
            body{
            background: rgb(0, 0, 0) url("http://images.forwallpaper.com/files/images/4/45d9/45d90ca4/314285/green-white-thread.jpg") no-repeat;
            color: #5a5a5a;
            font: normal 11px tahoma,helvetica,arial,sans-serif;
            padding-bottom: 20px;
            background-repeat: no-repeat;
          background-size: 100pc;
            }
            .conectado {
            margin-top: -2.9%;
            margin-left: 6%;
            position: absolute;
            background: rgba(0, 0, 0, 0.18);
            height: 37px;
            box-shadow: inset rgba(255, 255, 255, 0.25) 0px 0px 0px 1px;
            -webkit-box-shadow: inset rgba(255, 255, 255, 0.25) 0px 0px 0px 1px;
            border: 1px solid rgba(0, 0, 0, 0.35);
            width: 87%;
            }
            .botao {
            font-weight: bold;
            color: white;
            float: left;
            padding: 0 13px 9px 13px;
            line-height: 36px;
            outline: none;
            height: 26px;
            text-decoration: none;
            }
            .botao a {
            color: white;
            text-decoration: none;
            }
            .botao:hover {
            background: rgba(0, 0, 0, 0.1);
            }
            #brunoh {
            background-color: #fbfbfb;
            border: 1px solid rgb(231, 231, 231);
            padding: 6px;
            }
            .redesociais {
            margin-left: 820px;
            margin-top: -288px;
            position: absolute;
            }
          #tabcont-brunoh {
    padding: 10px;
    width: 600px;
    background: rgba(188, 180, 180, 0.12) none repeat scroll 0% 0%;
    z-index: 1;
    min-height: 100px;
    color: white;
    border-radius: 10px;
    left: 22pc;
    }
            .copyright {
            margin-top: 264px;
            color: #5F5757;
            }


    div#soufoda {
    position: relative;
    left: -39pc;
    top: 9pc;
    -webkit-transition: background-color 0.5s;
    transition: background-color 0.5s;
background-color: rgb(247, 246, 246);
    border-color: rgba(0, 0, 0, 0.188235);
    border-radius: 6px;
    border-style: solid;
    border-width: 1px 1px 3px;
    box-shadow: rgba(66, 66, 66, 0.760784) 0px 0px 2px inset;
    color: rgb(249, 249, 249);
    display: block;
    font-size: 14px;
    font-weight: 700;
    padding: 3px 6px;
    text-align: center;
    text-shadow: rgba(0, 0, 0, 0.2) 0px -1px 0px;
    width: 24pc;
    height: 123px;
    }
    div#sennior1:hover {
    background-color: rgb(63, 63, 63);
    }
    div#sennior2:hover {
    background-color: rgb(63, 63, 63);
    padding-bottom: 11px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    position: relative;
    left: -623px;
    }
    div#sennior:hover {
    background-color: rgb(63, 63, 63);
    }
    div#sennior1 {
    position: relative;
    top: 13px;
    -moz-transition: background-color .5s;
    -o-transition: background-color .5s;
    -webkit-transition: background-color .5s;
    border-color: transparent;
    border-width: 1px 1px 3px;
    color: #F9F9F9;
    display: block;
    font-size: 14px;
    font-weight: 700;
    padding: 3px 6px;
    text-align: center;
    text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
    transition: background-color .5s;
    width: 24pc;
    left: -39pc;
    }
    div#sennior4:hover {
    background-color: rgb(63, 63, 63);
    padding: 6px;
    }
    div#sennior4 {
    position: relative;
    top: 13px;
    -moz-transition: background-color .5s;
    -o-transition: background-color .5s;
    -webkit-transition: background-color .5s;
    border-color: transparent;
    border-width: 1px 1px 3px;
    color: #F9F9F9;
    display: block;
    font-size: 14px;
    font-weight: 700;
    padding: 3px 6px;
    text-align: center;
    text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
    transition: background-color .5s;
    width: 24pc;
    left: -39pc;
    }
    div#sennior2 {
    position: relative;
    top: 13px;
    -moz-transition: background-color .5s;
    -o-transition: background-color .5s;
    -webkit-transition: background-color .5s;
    border-width: 1px 1px 3px;
    color: #F9F9F9;
    display: block;
    font-size: 14px;
    font-weight: 700;
    padding: 3px 6px;
    text-align: center;
    text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
    transition: background-color .5s;
    width: 24pc;
    left: -39pc;
    }
            </style>
    <center>
                                  <link rel="shortcut icon" type="image/x-icon" href="http://gameofthrones-845.ah.bpcdn.net/favicon.ico?" />        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />        <title>Vertigem</title>                                         
                                                   
      <center>
                                                       
          <div id="tabcont-brunoh">
                                                                       
            <div id="tab1" style="font-size:13px; color: rgb(171, 171, 171); display: block;">
                                                                                       
                <ul>
                                                          A Clinica Cior está há mais de cinco anos no mercado odontológico, com profissionais especializados e equipamentos de última geração. Cior, um sorriso muda tudo.               
                </ul>
                                                                                 
            </div>
                                                                           
          </div>
                                                   
      </center>
                                                   
      <center>
                                                         
          <div class="menu">
                                                                       
            <div id="cssmenu">
                                                                                                   
                <center>
                                                                                                     
                  <div id="Soufoda">
                                                                         
                  </div>
                                                                     
                  <div id="sennior4">

                                                                                                                     
                      <div id="tab1" style="display: block; color:#CFCFCF;">
                                                                                                                                   
                        <ul>
                                                                                        <a href="/login">Login</a>                                                   
                        </ul>
                                                                                                                             
                      </div>
                                                                                                     
                  </div>
                                                                                           
                  <div id="sennior1">
                                                                                                                           
                      <div id="tab1" style="display: block;">
                                                                                                                                         
                        <ul>
                                                                                            <a href="/register">Registro</a>                                                       
                        </ul>
                                                                                                                                   
                      </div>
                                                                                                       
                  </div>
                                                                                             
                  <div id="sennior2">
                                                                                                                                 
                      <div id="tab1" style="display: block;">
                                                                                                                                               
                        <ul>
    <a href="/forum">Cior Odontologia</a> 
                        </ul>
                                 

                      </div>
                                                                                                                             
                  </div>
                                                                                                                             
                </center>
                                                                                 
            </div>
                                                                                   
          </div>
                                                         
          <div class="copyright">
    Copyright ® Criação de BrunoH. / Edição por Fraise, Carlos Silveira em parceria com a clínica Cior Odontologia.               
          <br><img src="http://i58.tinypic.com/29pum3l.png"/>
    </div>
                                                   
      </center>
                                  <a href="http://www.forumeiros.com" target="_blank" style="display: none;"> Fórumeiros</a>
    </center>

Atenciosamente,
Raffy
avatar

Rafael
Hiperativo

Masculino
Inscrito dia : 26/04/2014
Mensagens : 3118
Pontos Ativos : 4029

Ver perfil do usuário http://maisforum.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 14/07/15, 03:23 pm

@Raffy ficou maravilhoso e obrigado pela dica! Eu não sabia quanto ao código. Peço apenas uma última alteração. No hover do mouse sobre os botões, tem como você colocar apenas um hover de aumento de fonte nos botões? Se não conseguir, queria algo mais delicado nesse efeito do mouse sobre os botões...Desde já agradeço.
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Shaman em 14/07/15, 03:28 pm

Apenas uma observação! Muito feliz

A página não está responsiva e seu tamanho não se adapta a todas as resoluções, dependendo do monitor de cada um, pode ficar ruim a visualização da mesma ^^
avatar

Shaman
Membro do Fórum

Masculino
Inscrito dia : 30/01/2014
Mensagens : 1784
Pontos Ativos : 2448

Ver perfil do usuário http://www.nexplorer.tk https://www.facebook.com/pages/Nexplorer/857666487628799?fref=ts

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 14/07/15, 03:34 pm

@Shaman Realmente, sai e entrei novamente e a página fica com background preto por bastante tempo até carregar novamente. O que pode ser feito? Uma qualidade menor de background ou efeitos mais simples?
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Shaman em 14/07/15, 03:47 pm

@kakakoro escreveu:@Shaman Realmente, sai e entrei novamente e a página fica com background preto por bastante tempo até carregar novamente. O que pode ser feito? Uma qualidade menor de background ou efeitos mais simples?
Não, isso não é o problema, e sim a resolução, experimente aumentar ou diminuir a resolução (CTRL + rolar scroll do mouse) e verá! Teríamos que recriar a página para resolver tal problema.

Abs.
avatar

Shaman
Membro do Fórum

Masculino
Inscrito dia : 30/01/2014
Mensagens : 1784
Pontos Ativos : 2448

Ver perfil do usuário http://www.nexplorer.tk https://www.facebook.com/pages/Nexplorer/857666487628799?fref=ts

Resolvido Re: Página Principal em HTML

Mensagem por Rafael em 14/07/15, 03:48 pm

Olá @kakakoro,

Não se preocupe muito com o que o Shaman disse, ele talvez apenas avaliou as versões antigas desta página. Pois eu modifiquei tudo e removi praticamente todas as "position: absolute". Assim os elementos estão bem classificados.

Agora a página está muito melhor Piscada
Quanto ao seu pedido aqui está:

Código:

        <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />                          <style>
                <!----------------------------------------------- Créditos: -----------------------------------------------!>
                Está página foi desenvolvida por BrunoH. - Web Designer e Programador
                Nome: BrunoH. Páginas HTML
                Autor: BrunoH.
                Link: http://brunohweb.tk/
                Data: 11/07/2013
                A Copia desta página sem autorização do autor, poderá ser processado pois a página contem direitos autorais reservados!
                <!-------------------------------- Não retire os créditos - @copyright 2013 -------------------------------!>








                hr {
                border-color: #fff;
                }
                #top5 {
                display:none;
                position: fixed;
                left: 86.6%;
                top: 97%;
                color: #73AAFD;
                font-family: "Courier New", Courier, monospace font-size:14px;
                font-weight: bold;
                text-shadow: black 0.15em 0.15em 0.2em;
                opacity: 0.7;
                -webkit-transition-duration: 1s;
                background: rgb(27, 27, 27);
                width: 20%;
                -webkit-box-shadow: rgb(255, 255, 255) 1px 1px 6px;
                }
                #top5:hover {
                height: 80%;
                top: 47%;
                opacity: 1;
                }
                #topo1 {
                position: absolute;
                left: 81%;
                top: 1.5%;
                color: rgb(211, 211, 211);
                font-weight: bold;
                text-shadow: black 0.15em 0.15em 0.2em;
                -webkit-transition-duration: 1s;
                }
                #topo2ip {
                color: rgb(214, 214, 214);
                display: inline;
                }
                #topo2 {
                position: absolute;
                top: 0%;
                color: #73AAFD;
                font-weight: bold;
                text-shadow: black 0.15em 0.15em 0.2em;
                background: transparent;
                width: 98%;
                -webkit-transition-duration: 1s;
                border-bottom: 1px solid rgba(255, 255, 255, 0.53);
                padding: 4px;
                }
                #topo2:hover {opacity: 1;}
                #cssmenu ul,
                #cssmenu li,
                #cssmenu span,
                #cssmenu a {
                  margin: 0;
                  padding: 0;
                  position: relative;
                }
                #cssmenu {
                height: 49px;
                background: transparent;
                margin-left: 80%;
                margin-top: -10%;
                width: 17%!important;
                }
                #cssmenu:after,
                #cssmenu ul:after {
                  content: '';
                  display: block;
                  clear: both;
                }
                #cssmenu a {
        background: transparent none repeat scroll 0% 0%;
        color: rgb(185, 185, 185);
        display: inline-block;
        line-height: 35px;
        padding: 0px 20px;
        text-decoration: none;
        border-radius: 3px;
        font-size: 19px;
        margin-left: 5px;
        font-weight: 100 !important;
    }
                #cssmenu ul {
                  list-style: none;
                }
                #cssmenu > ul {
                  float: left;
                }
                #cssmenu > ul > li {
                  float: center;
                }
                #cssmenu > ul > li:hover:after {
                  content: '';
                  display: block;
                  width: 0;
                  height: 0;
                  position: absolute;
                  left: 50%;
                  bottom: 0;
                }
                #cssmenu > ul > li:hover > a {
                color: rgba(255, 255, 255, 0.55);
                }
                #cssmenu .has-sub {
                  z-index: 1;
                }
                #cssmenu .has-sub:hover > ul {
                  display: block;
                }
                #cssmenu .has-sub ul {
                  display: none;
                  position: absolute;
                  width: 200px;
                  top: 100%;
                  left: 0;
                }
                #cssmenu .has-sub ul li {
                  *margin-bottom: -1px;
                }
                #cssmenu .has-sub ul li a {
                  background: #0fa1e0;
                  border-bottom: 1px dotted #6fc7ec;
                  filter: none;
                  font-size: 11px;
                  display: block;
                  line-height: 120%;
                  padding: 10px;
                }
                #cssmenu .has-sub ul li:hover a {
                  background: #0c7fb0;
                }
                #cssmenu .has-sub .has-sub:hover > ul {
                  display: block;
                }
                #cssmenu .has-sub .has-sub ul {
                  display: none;
                  position: absolute;
                  left: 100%;
                  top: 0;
                }
                #cssmenu .has-sub .has-sub ul li a {
                  background: #0c7fb0;
                  border-bottom: 1px dotted #6db2d0;
                }
                #cssmenu .has-sub .has-sub ul li a:hover {
                  background: #095c80;
                }
                .menu {
                width: 87.2%;
                background: transparent;
                margin-top: 4%;
                margin-left: 5%;
                padding: 10px;
                -webkit-border-radius: 7px 7px 0px 0;
                color:#fff;
                }
                .menu a{
                transition:all linear 0.5s;
                -moz-transition:all linear 0.5s;
                -webkit-moz-trasition:all linear 0.5s;
                font-weight:bold;
                color:#999999;
                margin-right:35px;
                text-decoration:none;
                }
                #tabela1 {
                background: transparent;
                width: 1%;
                float: center;
                height: 1%;
                margin-top: 383px;
                }
                #tabela1 a{
                text-decoration:none;
                color:#000;
                }
                body{
                background: rgb(0, 0, 0) url("http://images.forwallpaper.com/files/images/4/45d9/45d90ca4/314285/green-white-thread.jpg") no-repeat;
                color: #5a5a5a;
                font: normal 11px tahoma,helvetica,arial,sans-serif;
                padding-bottom: 20px;
                background-repeat: no-repeat;
              background-size: 100pc;
                }
                .conectado {
                margin-top: -2.9%;
                margin-left: 6%;
                position: absolute;
                background: rgba(0, 0, 0, 0.18);
                height: 37px;
                box-shadow: inset rgba(255, 255, 255, 0.25) 0px 0px 0px 1px;
                -webkit-box-shadow: inset rgba(255, 255, 255, 0.25) 0px 0px 0px 1px;
                border: 1px solid rgba(0, 0, 0, 0.35);
                width: 87%;
                }
                .botao {
                font-weight: bold;
                color: white;
                float: left;
                padding: 0 13px 9px 13px;
                line-height: 36px;
                outline: none;
                height: 26px;
                text-decoration: none;
                }
                .botao a {
                color: white;
                text-decoration: none;
                }
                .botao:hover {
                background: rgba(0, 0, 0, 0.1);
                }
                #brunoh {
                background-color: #fbfbfb;
                border: 1px solid rgb(231, 231, 231);
                padding: 6px;
                }
              #tabcont-brunoh {
        padding: 10px;
        width: 600px;
        background: rgba(188, 180, 180, 0.12) none repeat scroll 0% 0%;
        z-index: 1;
        min-height: 100px;
        color: white;
        border-radius: 10px;
        left: 22pc;
        }
                .copyright {
                margin-top: 264px;
                color: #5F5757;
                }


        div#soufoda {
        position: relative;
        left: -39pc;
        top: 9pc;
        -webkit-transition: background-color 0.5s;
        transition: background-color 0.5s;
    background-color: rgb(247, 246, 246);
        border-color: rgba(0, 0, 0, 0.188235);
        border-radius: 6px;
        border-style: solid;
        border-width: 1px 1px 3px;
        box-shadow: rgba(66, 66, 66, 0.760784) 0px 0px 2px inset;
        color: rgb(249, 249, 249);
        display: block;
        font-size: 14px;
        font-weight: 700;
        padding: 3px 6px;
        text-align: center;
        text-shadow: rgba(0, 0, 0, 0.2) 0px -1px 0px;
        width: 24pc;
        height: 123px;
        }
        div#sennior1 {
        position: relative;
        top: 13px;
        -moz-transition: background-color .5s;
        -o-transition: background-color .5s;
        -webkit-transition: background-color .5s;
        border-color: transparent;
        border-width: 1px 1px 3px;
        color: #F9F9F9;
        display: block;
        font-size: 14px;
        font-weight: 700;
        padding: 3px 6px;
        text-align: center;
        text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
        transition: background-color .5s;
        width: 24pc;
        left: -39pc;
        }
.tabmen:hover a {
font-size: 22px !important;
}
        div#sennior4 {
        position: relative;
        top: 13px;
        -moz-transition: background-color .5s;
        -o-transition: background-color .5s;
        -webkit-transition: background-color .5s;
        border-color: transparent;
        border-width: 1px 1px 3px;
        color: #F9F9F9;
        display: block;
        font-size: 14px;
        font-weight: 700;
        padding: 3px 6px;
        text-align: center;
        text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
        transition: background-color .5s;
        width: 24pc;
        left: -39pc;
        }
        div#sennior2 {
        position: relative;
        top: 13px;
        -moz-transition: background-color .5s;
        -o-transition: background-color .5s;
        -webkit-transition: background-color .5s;
        border-width: 1px 1px 3px;
        color: #F9F9F9;
        display: block;
        font-size: 14px;
        font-weight: 700;
        padding: 3px 6px;
        text-align: center;
        text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
        transition: background-color .5s;
        width: 24pc;
        left: -39pc;
        }
                </style>
        <center>
                                      <link rel="shortcut icon" type="image/x-icon" href="http://gameofthrones-845.ah.bpcdn.net/favicon.ico?" />        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />        <title>Vertigem</title>                                        
                                                      
          <center>
                                                          
              <div id="tabcont-brunoh">
                                                                          
                <div id="tab1" style="font-size:13px; color: rgb(171, 171, 171); display: block;">
                                                                                          
                    <ul>
                                                              A Clinica Cior está há mais de cinco anos no mercado odontológico, com profissionais especializados e equipamentos de última geração. Cior, um sorriso muda tudo.              
                    </ul>
                                                                                    
                </div>
                                                                              
              </div>
                                                      
          </center>
                                                      
          <center>
                                                            
              <div class="menu">
                                                                          
                <div id="cssmenu">
                                                                                                      
                    <center>
                                                                                                        
                      <div id="Soufoda">
                                                                            
                      </div>
                                                                        
                      <div id="sennior4" class="tabmen">

                                                                                                                        
                          <div id="tab1" style="display: block; color:#CFCFCF;">
                                                                                                                                      
                            <ul>
                                                                                            <a href="/login">Login</a>                                                  
                            </ul>
                                                                                                                                
                          </div>
                                                                                                        
                      </div>
                                                                                              
                      <div id="sennior1" class="tabmen">
                                                                                                                              
                          <div id="tab1" style="display: block;">
                                                                                                                                            
                            <ul>
                                                                                                <a href="/register">Registro</a>                                                      
                            </ul>
                                                                                                                                      
                          </div>
                                                                                                          
                      </div>
                                                                                                
                      <div id="sennior2" class="tabmen">
                                                                                                                                    
                          <div id="tab1" style="display: block;">
                                                                                                                                                  
                            <ul>
        <a href="/forum">Cior Odontologia</a>
                            </ul>
                                    

                          </div>
                                                                                                                                
                      </div>
                                                                                                                                
                    </center>
                                                                                    
                </div>
                                                                                      
              </div>
                                                            
              <div class="copyright">
        Copyright ® Criação de BrunoH. / Edição por Fraise, Carlos Silveira em parceria com a clínica Cior Odontologia.              
              <br><img src="http://i58.tinypic.com/29pum3l.png"/>
        </div>
                                                      
          </center>
                                      <a href="http://www.forumeiros.com" target="_blank" style="display: none;"> Fórumeiros</a>
        </center>

Atenciosamente.


Última edição por Raffy em 14/07/15, 03:52 pm, editado 1 vez(es) (Razão : Edição)
avatar

Rafael
Hiperativo

Masculino
Inscrito dia : 26/04/2014
Mensagens : 3118
Pontos Ativos : 4029

Ver perfil do usuário http://maisforum.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 14/07/15, 03:50 pm

@Shaman como eu estou fazendo este fórum como teste para a empresa onde trabalho, vou deixar assim por enquanto. Eu realmente precisava apenas de um hover mais simples dos botões.
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 14/07/15, 03:53 pm

Funcionou! está ótimo! @Raffy muito obrigado e @Shaman obrigado pela observação. Excelente trabalho!
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Rafael em 14/07/15, 03:54 pm

@kakakoro escreveu:Funcionou! está ótimo! @Raffy muito obrigado e @Shaman obrigado pela observação. Excelente trabalho!

@kakakoro,

Eu editei a minha última mensagem porquê o efeito hover que eu coloquei não tinha aplicado, volte a trocar o código e veja se é assim que deseja...

Atenciosamente.
avatar

Rafael
Hiperativo

Masculino
Inscrito dia : 26/04/2014
Mensagens : 3118
Pontos Ativos : 4029

Ver perfil do usuário http://maisforum.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por kakakoro em 14/07/15, 04:01 pm

@Raffy Agora sim, haha. Achei que fosse de propósito o hover bloqueado. Obrigado pela atenção! <3
avatar

kakakoro
Membro do Fórum

Masculino
Inscrito dia : 05/08/2012
Mensagens : 1006
Pontos Ativos : 1587

Ver perfil do usuário http://www.rpgorigem.forumeiros.com

Resolvido Re: Página Principal em HTML

Mensagem por Rafael em 14/07/15, 04:12 pm

Ótimo Feliz

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

Rafael
Hiperativo

Masculino
Inscrito dia : 26/04/2014
Mensagens : 3118
Pontos Ativos : 4029

Ver perfil do usuário http://maisforum.forumeiros.com

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