|
|
Linha 1: |
Linha 1: |
| | | |
| | | |
− | <html>
| |
− | <head>
| |
− | <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
| |
− | <style type="text/css">
| |
− | <!--
| |
− | .unsel {
| |
− | border-bottom-width: thin;
| |
− | border-bottom-style: inset;
| |
− | border-bottom-color: #ADD8E6; <!-- Cor da borda da aba -->
| |
− | font-style: normal;
| |
− |
| |
− | }
| |
− |
| |
− | .sel {
| |
− | border-top-width: thin;
| |
− | border-right-width: thin;
| |
− | border-bottom-width: 12px;
| |
− | border-left-width: thin;
| |
− | border-top-style: solid;
| |
− | border-right-style: solid;
| |
− | border-bottom-style: none;
| |
− | border-left-style: solid;
| |
− | border-top-color: #ADD8E6;<!-- cor da borda da aba-->
| |
− | border-right-color: #ADD8E6;<!-- cor da borda da aba-->
| |
− | border-left-color: #ADD8E6;<!-- cor da borda da aba-->
| |
− | font-weight: bold;
| |
− | background-color: #F8F8FF;<!-- cor de fundo-->
| |
− | }
| |
− | .divsel {
| |
− | visibility: visible;
| |
− | position: absolute;
| |
− | left: 6px;<!-- distância do conteúdo em relação à esquerda do browser-->
| |
− | top: 57px;<!-- distância do conteúdo em relação ao topo-->
| |
− | height: 520px;<!-- altura do conteúdo-->
| |
− | width: 984px;<!-- largura do conteúdo-->
| |
− | background-color: #ADD8E6;<!-- cor de fundo do conteúdo-->
| |
− | right: 10px;
| |
− | bottom: 10px;
| |
− | }
| |
− |
| |
− | .divunsel {
| |
− | visibility: hidden;
| |
− | }
| |
− | -->
| |
− |
| |
− | </head>
| |
− |
| |
− | <body>
| |
− | <div align="left" id="aba">
| |
− | <script language="JavaScript">
| |
− | function se
| |
− |
| |
− |
| |
− |
| |
− | l(idaba){
| |
− | var aba=document.getElementById(idaba);
| |
− | var nAbas="5"; <!-- colocar o número de abas 1-->
| |
− | for(var i="1";i<nAbas;i++){
| |
− | var id="aba"+i;
| |
− | document.getElementById(id).className="unsel";
| |
− | }
| |
− | aba.className="sel";
| |
− |
| |
− | for(var u="1";u<nAbas;u++){
| |
− | var idt="textaba"+u;
| |
− | document.getElementById(idt).className="divunsel";
| |
− | }
| |
− | var iddiv="text"+idaba;
| |
− | document.getElementById(iddiv).className="divsel";
| |
− | }
| |
− | </script>
| |
− | <table width="100%" border="0" align="center" cellspacing="0" id="t_abas">
| |
− | <tr id="tr_abas">
| |
− | <td width="16,67%" class="unsel" >Versão 5</td>
| |
− | <td id="aba1" width="16,67%" class="sel" align="center" onClick="sel(this.id)">Atendimentos</td><!-- colocar as abas aqui. Cuidado para não mudar as id das abas: formata: aba+número. ver exemplo-->
| |
− | <td id="aba2" width="16,67%"align="center" class="unsel" onClick="sel(this.id)" href="www.google.com.br">Clientes</td>
| |
− | <td id="aba3" width="16,67%" align="center" class="unsel" onClick="sel(this.id)">Painel de Configuração</td>
| |
− | <td id="aba4" width="16,67%" align="center" class="unsel" onClick="sel(this.id)">Prospecto</td>
| |
− | <td width="16,67%" class="unsel"> </td>
| |
− | </tr>
| |
− | </table>
| |
− | </div>
| |
− |
| |
− | <div id="textaba1" class="divsel"></div><!-- colocar aqui o conteúdo das abas. Atenção para seguir o mesmo modelo de id.-->
| |
− |
| |
− |
| |
− | <div id="textaba2" class="divunsel"></div>
| |
− |
| |
− |
| |
− | <div id="textaba3" class="divunsel"></div>
| |
− |
| |
− |
| |
− | <div id="textaba4" class="divunsel">
| |
− |
| |
− | </body>
| |
− |
| |
− | </html>
| |
− |
| |
− |
| |
− | {| style="margin-top:5px; width:10%; margin-bottom:2px; margin-left:30px"
| |
− | |class="fundologo" style="background-repeat:no-repeat; background-position:-40px -15px; width:100%; border:1px solid #a7d7f9; vertical-align:top; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius:10px;box-shadow:0 1px 3px rgba(0, 0, 0, 0.35)" |
| |
− |
| |
− | [[Arquivo:Cliente.png|center|100px]]
| |
− | |}
| |
− | {| style="margin-top:5px; width:10%; margin-bottom:2px; margin-left:30px"
| |
− | |class="fundologo" style="background-repeat:no-repeat; background-position:-40px -15px; width:100%; border:1px solid #a7d7f9; vertical-align:top; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius:10px;box-shadow:0 1px 3px rgba(0, 0, 0, 0.35)" |
| |
− |
| |
− | [[Arquivo:atendimentos.png|center|100px]]
| |
− | |}
| |
− | {| style="margin-top:5px; width:10%; margin-bottom:2px; margin-left:30px"
| |
− | |class="fundologo" style="background-repeat:no-repeat; background-position:-40px -15px; width:100%; border:1px solid #a7d7f9; vertical-align:top; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius:10px;box-shadow:0 1px 3px rgba(0, 0, 0, 0.35)" |
| |
− |
| |
− | [[Arquivo:Prospecto.png|center|100px]]
| |
− | |}
| |
| | | |
| [[Teste2]] | | [[Teste2]] |
| [[Teste3]] | | [[Teste3]] |