Ir para conteúdo
Fórum Script Brasil
  • 0

Linha Pontilhada


Guest Pablo

Pergunta

Galera, gostaria de saber como fazer akelas linhas pontilhadas igual a pagina inicial do UOL

Pelo que percebi, akelas linhas são as linhas internas de uma tabela é isso, mas tem como eu fazer aparecer somente as linhas internas de uma tabela.......

Link para o comentário
Compartilhar em outros sites

7 respostass a esta questão

Posts Recomendados

  • 0

isso eu entendi, mas gostaria saber se eu possuir uma tabela com 10 linhas, se eu consigo somente as linhas de dentro (nem a primeira e nem a ultima linha) ficarem pontilhadas.....

Link para o comentário
Compartilhar em outros sites

  • 0

<html>
<head>
<style>
.table {
	border: 1px dashed #EE4334;
}
</style>
</head>
<body>
	<table width="400" id="table" class="table">
        <tr>
         <td>Teste1</td><td>Teste2</td>
        </tr>
        <tr>
         <td>Teste1</td><td>Teste2</td>
        </tr>
        <tr>
         <td>Teste1</td><td>Teste2</td>
        </tr>
        <tr>
         <td>Teste1</td><td>Teste2</td>
        </tr>
        <tr>
         <td>Teste1</td><td>Teste2</td>
        </tr>
        <tr>
         <td>Teste1</td><td>Teste2</td>
        </tr>
        <tr>
         <td>Teste1</td><td>Teste2</td>
        </tr>
        <tr>
         <td>Teste1</td><td>Teste2</td>
        </tr>
        <tr>
         <td>Teste1</td><td>Teste2</td>
        </tr>
        <tr>
         <td>Teste1</td><td>Teste2</td>
        </tr>
    </table>
<script>
document.getElementById('table').frame = 'void';
document.getElementById('table').rules = 'all';
</script>
</body>
</html>

Cara dá uma olhada no código q eu fiz pra ti. a tabela possui propriedades q podem ser setadas, que é frame(bordas de fora da tabela) e rules(bordas de dentro). Meu único problema, pelo menos aqui no Mozilla, foi que essa propriedades não aceitam "dashed" como estilo.

Testa no IE e se não funcionar você vai ter que trabalhar com as td e tr mesmo...

Abraço

Crystian

Link para o comentário
Compartilhar em outros sites

  • 0

É um pouco grande este código, de repente tem outro mais curtinho, mas pelo menos funciona!!

<html>

<head>

<style type="text/css">

<!--

.table1 { border: dotted; border-width: 0px 1px 1px 0px; border-color: black black #000000 #000000}

.table2 { border: dotted; border-width: 0px 1px 0px 0px; border-color: #000000 #000000 black black}

.table_out { border: #000000; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}

.table3 { border: dotted; border-width: 0px 0px 1px; border-color: #000000 #000000 black black }

.table4 { border-style: none}

-->

</style>

</head>

<body>

<table width="400" id="table" cellspacing="0" class="table_out">

<tr>

<td class="table1">Teste1</td>

<td class="table3">Teste2</td>

</tr>

<tr>

<td class="table1">Teste1</td>

<td class="table3">Teste2</td>

</tr>

<tr>

<td class="table1">Teste1</td>

<td class="table3">Teste2</td>

</tr>

<tr>

<td class="table1">Teste1</td>

<td class="table3">Teste2</td>

</tr>

<tr>

<td class="table1">Teste1</td>

<td class="table3">Teste2</td>

</tr>

<tr>

<td class="table1">Teste1</td>

<td class="table3">Teste2</td>

</tr>

<tr>

<td class="table1">Teste1</td>

<td class="table3">Teste2</td>

</tr>

<tr>

<td class="table1">Teste1</td>

<td class="table3">Teste2</td>

</tr>

<tr>

<td class="table1">Teste1</td>

<td class="table3">Teste2</td>

</tr>

<tr>

<td class="table2">Teste1</td>

<td class="table4">Teste2</td>

</tr>

</table>

<script>

document.getElementById('table').frame = 'void';

document.getElementById('table').rules = 'all';

</script>

</body>

</html>

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,3k
×
×
  • Criar Novo...