Ir ao conteúdo
  • Cadastre-se
Iking1

CSS Como adicionar espaçamento entre as linhas de uma tabela

Recommended Posts

Boa noite. Galera estou fazendo uma atividade da faculdade, na qual eu tenho que fazer uma espécie de uma tabela do brasileirão tipo a do GE, só que o design não está lega, quero adiciona rum espaçamento entre as linhas da tabela, mas não sei como fazer isso, alguém poderia me ajudar?

Captura de Tela (100).png

Captura de Tela (101).png

Compartilhar este post


Link para o post
Compartilhar em outros sites

@Iking1 Olá, 

O espaçamento que você diz, é colocar uma divisória em cada linha da tabela? 

quer fazer o efeito zebra?

 

Se for uma divisória você pode simplesmente definir o border collapse, para a table, tr e td.

Definir para td uma borda da espessura que quiser, cor e definir para ser no bottom, além de definir o padding.

Exemplo online: http://jsfiddle.net/dife/rcx9gfj1/5/

 

Ou você pode usar o even e odd, onde respectivamente é par e ímpar.

Exemplo online: http://jsfiddle.net/dife/dewhf50j/3/

  • Curtir 1

Compartilhar este post


Link para o post
Compartilhar em outros sites

Mano resolvi um pouco o visual, resolvi dar só um padding já melhor bastante. Mas me surgiu outra dúvida, como faço pra colocar meu titulo ali exatamente no centro da div?

Captura de Tela (105).png

Captura de Tela (104).png

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá Iking1:). O design você pode arrumar adicionando fontes e ícones para dar um toque a mais. Eu lhe recomendo o site fonts.google.com para as fontes, tem bastante fontes boas por lá, também lhe recomendo um repositório para ícones, deixo aqui o site do iconsawesome fontawesome.com, mas lembre-se menos é mais, então não abuse de fontes. Enquanto o espaçamento das listas, se você usar a propriedade line-height irá conseguir adicionar espaços na parta inferior da lista, também é possível usar a propriedade margin-bottom para isso e margin-top, para espaçar o lado superior da lista.

  • Curtir 1

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar agora





Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas publicações sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×