|
|
|
||||||||||||||||||||||
|
|||||||||||||||||||||||
|
|||||||||||||||||||||||
Parceiros - CSS para Web Design - S.O.S Designers - Slackware-Brasil - Crie seu Web site - Oficina da Net |
Tabelas em HTML. Atributos da tabela e conclusão.Vamos conhecer os principais atributos que podemos atribuir à tabela de forma geral. Além disso, veremos vários exemplos práticos de construção de tabelas. Além dos atributos específicos de cada célula ou linha, as tabelas podem ser adicionalmente formatadas a partir dos atributos que nos oferece a própria etiqueta <table>. A seguir, mostramos aqueles que nos podem parecer à principio mais importantes:
Os atributos que definem as dimensões, height e width, funcionam de uma maneira análoga ao das células, tal como vimos no capítulo anterior. Contrariamente, o atributo align não nos permite justificar o texto de cada una das células que compõem a tabela, mas sim que permite, justificar a própria tabela em relação ao seu entorno. Vamos colocar três exemplos de alinhamento de tabelas, centralizadas, alinhadas à direita e à esquerda.
Os atributos cellpading e cellspacing ajudarão a dar a nossa tabela um aspecto mais estético. À princípio pode nos parecer um pouco confuso seu uso mas com um pouco de prática já será suficiente para saber utilizá-los. Na seguinte imagem podemos ver graficamente o significado destes atributos: ![]() Você mesmo pode comprovar que os atributos definidos para uma célula têm prioridade em relação aos definidos para uma tabela. Podemos definir, por exemplo, uma tabela com a cor de fundo vermelha e uma das células com a cor de fundo verde. E assim, toda a tabela será vista de cor vermelha manos a célula verde. Da mesma forma, podemos definir uma cor azul para as bordas da tabela e fazer com que uma célula particular seja mostrada com uma borda vermelha. (Apesar de que isto não funcionará em todos os navegadores devido ao fato de alguns não reconhecerem o atributo bordercolor.)
Tabelas aninhadas O uso de tabelas aninhadas também é muito útil. Da mesma forma que podíamos incluir listas dentro de outras listas, as tabelas podem ser incluídas dentro de outras. Assim, podemos incluir uma tabela dentro da célula de outra. A forma de funcionamento continua sendo o mesmo apesar de que a situação pode se complicar se o número de tabelas incluídas dentro de outras for elevado. Vamos ver um código de um aninhamento de tabelas. Veremos primeiro o resultado e em seguida, o código, pois assim conseguiremos entendê-lo melhor.
Este seria o código: <table cellspacing="10" cellpadding="10" border="3"> <tr> <td align="center"> Célula da tabela principal </td> <td align="center"> <table cellspacing="2" cellpadding="2" border="1"> <tr> <td>Tabela aninhada, célula 1</td> <td>Tabela aninhada, célula 2</td> </tr> <tr> <td>Tabela unida, célula 3</td> <td>Tabela aninhada, célula 4</td> </tr> </table> </td> </tr> </table> Exemplos práticos Estas são as informações que pretendíamos transmitir-lhes sobre as tabelas em HTML. Agora seria importante fazer algum exemplo de realização de uma tabela um pouco mais complexa. Por exemplo, a seguinte:
Outro exemplo de tabela com a qual podemos praticar:
Autoria e outras referências sobre este artigo Dentro deste artigo: + 1 manual relacionado + 1 categoria relacionada + 1 Comentário (Acrescentar) + 5 Comentários sem rever
Manuais relacionados com este artigo Dentro de Manual de HTML Seguinte: Formulários HTML Categorias relacionadas Através das categorias do nosso diretório podem ser encontrados outros tipos de recursos relacionados com este artigo: + Entrar em HTMLComentários dos visitantes
Comentário sem rever
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| Sobre nós | Copyright | Anuncie | Entrar em contato | <criarweb> |