diff options
Diffstat (limited to 'files/pt-pt/web/css/como_começar/tabelas/index.html')
| -rw-r--r-- | files/pt-pt/web/css/como_começar/tabelas/index.html | 655 |
1 files changed, 0 insertions, 655 deletions
diff --git a/files/pt-pt/web/css/como_começar/tabelas/index.html b/files/pt-pt/web/css/como_começar/tabelas/index.html deleted file mode 100644 index ff21a00c82..0000000000 --- a/files/pt-pt/web/css/como_começar/tabelas/index.html +++ /dev/null @@ -1,655 +0,0 @@ ---- -title: Tabelas -slug: Web/CSS/Como_começar/Tabelas -tags: - - 'CSS:Como_começar' -translation_of: Learn/CSS/Building_blocks/Styling_tables -translation_of_original: Web/Guide/CSS/Getting_started/Tables ---- -<p>{{ PreviousNext("CSS:Como começar:Disposição", "CSS:Como começar:Mídia") }}</p> - -<p>Esta página descreve seletores mais avançados, e algumas maneiras específicas para estilizar tabelas.</p> - -<p>Você cria um novo documento de amostra contendo uma tabela, e uma folha de estilo para isto.</p> - -<h2 id="Informa.C3.A7.C3.A3o:_Mais_seletores" name="Informa.C3.A7.C3.A3o:_Mais_seletores">Informação: Mais seletores</h2> - -<p>CSS possui algumas maneiras para selecionar elementos baseadas nas relações entre eles. Você pode usá-las para fazer seletores que sejam mais específicos.</p> - -<p>Aqui está um sumário de seletores baseados em relações:</p> - -<table style="margin-left: 2em;"> - <tbody> - <tr> - <td style="width: 10em;"><strong>Seletor</strong></td> - <td><strong>Seleciona</strong></td> - </tr> - <tr> - <td><code>A E</code></td> - <td>Qualquer elemento E que seja <em>descendente</em> de um elemento A (isso é: um subitem, ou um subitem de um sub item, <em>etc</em>.)</td> - </tr> - <tr> - <td><code>A > E</code></td> - <td>Qualquer elemento E que seja subitem de um elemento A</td> - </tr> - <tr> - <td><code>E:first-child</code></td> - <td>Qualque elemento E que seja o primeiro subitem do seu principal</td> - </tr> - <tr> - <td><code>B + E</code></td> - <td>Qualquer elemento E que seja o próximo <em>irmão</em> de um elemento B (isso é: o próximo subitem do mesmo principal)</td> - </tr> - </tbody> -</table> - -<p>Você pode combinar isto para expressar relações complexas.</p> - -<p>Você pode também usar o símbolo <code>*</code> (asterisco) para dizer "qualquer elemento".</p> - -<table style="border: 1px solid #36b; padding: 1em; background-color: #fffff4; margin-bottom: 1em;"> - <caption>Exemplo</caption> - <tbody> - <tr> - <td>Uma tabela HTML tem um atributo <code>id</code>, mas suas linhas e células não tem identificadores individuais: - <div style="width: 30em;"> - <pre class="eval"> -<TABLE id="data-table-1"> -... -<TR> -<TD>Prefix</TD> -<TD>0001</TD> -<TD>default</TD> -</TR> -... -</pre> - </div> - - <p>Estas regras fazem a primeira célula em cada linha em negrito, e a segunda célula em cada linha monoespaçada. Elas afetam somente uma tabela específica no documento:</p> - - <div style="width: 45em;"> - <ol> - <li>data-table-1 td:first-child {font-weight: bolder;}</li> - <li>data-table-1 td:first-child + td {font-family: monospace;}</li> - </ol> - </div> - - <p>O resultado é algo como isto:</p> - - <table style="border: 2px outset #36b; padding: 1em; background-color: white;"> - <tbody> - <tr> - <td> - <table style="width: 18em; margin-right: 2em;"> - <tbody> - <tr> - <td><strong>Prefix</strong></td> - <td><code>0001</code></td> - <td>default</td> - </tr> - </tbody> - </table> - </td> - </tr> - </tbody> - </table> - </td> - </tr> - </tbody> -</table> - -<table style="border: 1px solid #36b; padding: 1em; background-color: #f4f4f4; margin-bottom: 1em;"> - <caption>Mais detalhes</caption> - <tbody> - <tr> - <td>De maneira usual, se você faz um seletor mais específico então você aumenta sua prioridade. - <p>Usando estas técnicas, você evita precisar especificar atributos <code>class</code> ou <code>id</code> em muitas tags no seu documento. Em vez disso, CSS faz o trabalho.</p> - - <p>Em grandes projetos onde a velocidade é importante, você pode fazer suas folhas de estilo mais eficientes evitando regras complexas que dependem da relação entre elementos.</p> - - <p>Para detalhes completos sobre seletores, veja <a class="external" href="http://www.w3.org/TR/CSS21/selector.html">Selectors</a> em CSS Specification.</p> - </td> - </tr> - </tbody> -</table> - -<h2 id="Informa.C3.A7.C3.A3o:_Tabelas" name="Informa.C3.A7.C3.A3o:_Tabelas">Informação: Tabelas</h2> - -<p>Uma tabela é um arranjo de informação em uma grade retangular. Algumas tabelas podem ser complexas, e para tabelas complexas diferentes navegadores podem exibir diferentes resultados.</p> - -<p>Quando você desenha seu documento, use e a tabela para expressar as relações entre as peças da informação. Então não importará se os diferentes navegadores apresentarem a informação de maneiras levemente diferentes, pois o significado ainda pode ser compreendido.</p> - -<p>Não use tabelas de maneiras não usuais para produzir disposições visuais particulares. As técnicas na página anterior deste tutorial (<a href="/pt/CSS/Como_come%C3%A7ar/Disposi%C3%A7%C3%A3o" title="pt/CSS/Como_começar/Disposição">Disposição</a>) são melhores para isto.</p> - -<h4 id="Estrutura_da_tabela" name="Estrutura_da_tabela">Estrutura da tabela</h4> - -<p>Em uma tabela, cada peça de informação é exibida em uma <em>célula</em>.</p> - -<p>As células em uma linha horizontal na página compõem uma <em>linha</em>.</p> - -<p>Em algumas tabelas, as linhas podem ser agrupadas. Um grupo especial de linhas no começo da tabela é o <em>cabeçalho</em>. Um grupo especial de linhas no final da tabela é o <em>rodapé</em>. As linhas principais na tabela são o <em>corpo</em>, e elas podem também estar em grupos.</p> - -<p>As células em uma linha vertical na página compõem uma <em>coluna</em>, mas as colunas têm usos limitados nas tabelas das CSS.</p> - -<table style="border: 1px solid #36b; padding: 1em; background-color: #fffff4; width: 100%;"> - <caption>Exemplo</caption> - <tbody> - <tr> - <td>A tabela de seletores próxima ao topo desta página tem dez células em cinco linhas. - <p>A primeira linha é o cabeçalho. As outras quatro linhas são o corpo. Não há um rodapé.</p> - - <p>Ela tem duas colunas.</p> - </td> - </tr> - </tbody> -</table> - -<p>Este tutorial somente cobre tabelas simples, onde os resultados são razoavelmente previsíveis. Em uma tabela simples, toda célula ocupa somente uma linha e coluna. Você pode usar CSS para tabelas complexas onde células <em>expandam</em> (extendam-se sobre) mais do que uma linha ou coluna, mas tabelas como estas estão fora do escopo deste tutorial básico.</p> - -<h3 id="Bordas" name="Bordas">Bordas</h3> - -<p>Células não têm margens.</p> - -<p>Células têm bordas e enchimento. Por padrão, as bordas são separadas pelo valor da propriedade <code>border-spacing</code> da tabela. Você pode também remover o espaçamento completamente configurando a propriedade <code>border-collapse</code> da tabela para <code>collapse</code>.</p> - -<table style="border: 1px solid #36b; padding: 1em; background-color: #fffff4; width: 100%;"> - <caption>Exemplo</caption> - <tbody> - <tr> - <td>Aqui estão três tabelas. - <p>A tabela da esquerda tem espaçamento de borda 0.5 em. A tabela do centro tem espaçamento da borda zero. A tabela da direita tem bordas unidas:</p> - - <table style="border: 2px outset #36b; padding: 1em; background-color: white;"> - <tbody> - <tr> - <td style="padding-right: 2em;"> - <table style=""> - <tbody> - <tr> - <td style="border: 1px solid #c00; text-align: center;">Paus</td> - <td style="border: 1px solid #c00; text-align: center;">Copas</td> - </tr> - <tr> - <td style="border: 1px solid #c00; text-align: center;">Ouros</td> - <td style="border: 1px solid #c00; text-align: center;">Espadas</td> - </tr> - </tbody> - </table> - </td> - <td style="padding-right: 2em;"> - <table style=""> - <tbody> - <tr> - <td style="border: 1px solid #c00; text-align: center;">Paus</td> - <td style="border: 1px solid #c00; text-align: center;">Copas</td> - </tr> - <tr> - <td style="border: 1px solid #c00; text-align: center;">Ouros</td> - <td style="border: 1px solid #c00; text-align: center;">Espadas</td> - </tr> - </tbody> - </table> - </td> - <td style="padding-right: 6em;"> - <table style="border-collapse: collapse;"> - <tbody> - <tr> - <td style="border: 1px solid #c00; text-align: center;">Paus</td> - <td style="border: 1px solid #c00; text-align: center;">Copas</td> - </tr> - <tr> - <td style="border: 1px solid #c00; text-align: center;">Ouros</td> - <td style="border: 1px solid #c00; text-align: center;">Espadas</td> - </tr> - </tbody> - </table> - </td> - </tr> - </tbody> - </table> - </td> - </tr> - </tbody> -</table> - -<h3 id="Subt.C3.ADtulos" name="Subt.C3.ADtulos">Subtítulos</h3> - -<p>Um <em>subtítulo</em> é uma etiqueta que se aplica à tabela inteira. Por padrão, isto é mostrado no topo da tabela.</p> - -<p>Para mover isto para o fim, configure a propriedade <code>caption-side</code> para <code>bottom</code>. A propriedade é herdada, então alternativamente você pode configurar isto na tabela em outro elemento ascendente.</p> - -<p>Para estilizar o texto do subtítulo, use qualquer das propriedades usuais para texto.</p> - -<table style="border: 1px solid #36b; padding: 1em; background-color: #fffff4; width: 100%;"> - <caption>Exemplo</caption> - <tbody> - <tr> - <td>Esta tabela tem um subtítulo no fim: - <div style="width: 30em;"> - <pre class="eval"> -#demo-table > caption { - caption-side: bottom; - font-style: italic; - text-align: right; - } -</pre> - </div> - - <table style="border: 2px outset #36b; padding: 1em 6em 1em 1em; background-color: white;"> - <tbody> - <tr> - <td> - <table> - <caption>Naipes</caption> - <tbody> - <tr> - <td> - <table style="border-collapse: collapse;"> - <tbody> - <tr> - <td style="border: 1px solid gray; text-align: center;">Paus</td> - <td style="border: 1px solid gray; text-align: center;">Copas</td> - </tr> - <tr> - <td style="border: 1px solid gray; text-align: center;">Ouros</td> - <td style="border: 1px solid gray; text-align: center;">Espadas</td> - </tr> - </tbody> - </table> - </td> - </tr> - </tbody> - </table> - </td> - </tr> - </tbody> - </table> - </td> - </tr> - </tbody> -</table> - -<h3 id="C.C3.A9lulas_vazias" name="C.C3.A9lulas_vazias">Células vazias</h3> - -<p>Você pode exibir células vazias (isto é, suas bordas e fundos) especificando <code>empty-cells: show;</code> para o elemento da tabela.</p> - -<p>Você pode escondê-los especificando <code>empty-cells:hide;</code>. Então, se um elemento principal tem um fundo e o chama, isto mostra através da célula vazia.</p> - -<table style="border: 1px solid #36b; padding: 1em; background-color: #fffff4; width: 100%;"> - <caption>Exemplo</caption> - <tbody> - <tr> - <td>Estas tabelas tem um fundo de verde pálido. Suas células tem um fundo de cinza pálido e bordas de cinza escuro. - <p>Na esquerda da tabela, a célula vazia é mostrada. Na direita, é escondida:</p> - - <table style="border: 2px outset #36b; padding: 1em; background-color: white;"> - <tbody> - <tr> - <td style="padding-right: 2em;"> - <table style="background-color: #dfd;"> - <tbody> - <tr> - <td style="border: 1px solid #555; background-color: #eee;"> </td> - <td style="border: 1px solid #555; background-color: #eee; text-align: center;">Copas</td> - </tr> - <tr> - <td style="border: 1px solid #555; background-color: #eee; text-align: center;">Ouros</td> - <td style="border: 1px solid #555; background-color: #eee; text-align: center;">Espadas</td> - </tr> - </tbody> - </table> - </td> - <td style="padding-right: 6em;"> - <table style="background-color: #dfd;"> - <tbody> - <tr> - <td> </td> - <td style="border: 1px solid #555; background-color: #eee; text-align: center;">Copas</td> - </tr> - <tr> - <td style="border: 1px solid #555; background-color: #eee; text-align: center;">Ouros</td> - <td style="border: 1px solid #555; background-color: #eee; text-align: center;">Espadas</td> - </tr> - </tbody> - </table> - </td> - </tr> - </tbody> - </table> - </td> - </tr> - </tbody> -</table> - -<table style="border: 1px solid #36b; padding: 1em; background-color: #f4f4f4; margin-bottom: 1em;"> - <caption>Mais detalhes</caption> - <tbody> - <tr> - <td>Para informações detalhasdas sobre tabelas, veja <a class="external" href="http://www.w3.org/TR/CSS21/tables.html">Tables</a> em CSS Specification. - <p>A informação lá vai além do que há neste tutorial, mas não cobre as diferenças entre os navegadores que podem afetar tabelas complexas.</p> - </td> - </tr> - </tbody> -</table> - -<h2 id="A.C3.A7.C3.A3o:_Estilizando_uma_tabela" name="A.C3.A7.C3.A3o:_Estilizando_uma_tabela">Ação: Estilizando uma tabela</h2> - -<p>Faça um novo documento HTML, <code>doc3.html</code>. Copie e cole o conteúdo daqui, tendo certeza que você rolou a tela para pegar tudo isto:</p> - -<div style="width: 48em; height: 12em; overflow: auto;"> -<pre><DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"> -<HTML> -<HEAD> -<TITLE>Documento de amostra 3</TITLE> -<LINK rel="stylesheet" type="text/css" href="style3.css"> -</HEAD> -<BODY> - -<TABLE id="demo-table"> -<CAPTION>Oceanos</CAPTION> - -<THEAD> -<TR> -<TH></TH> -<TH>Área</TH> -<TH>Profundidade Média</TH> -</TR> -<TR> -<TH></TH> -<TH>milhões de km<SUP>2</SUP></TH> -<TH>m</TH> -</TR> -</THEAD> - -<TBODY> -<TR> -<TH>Ártico</TH> -<TD>13,000</TD> -<TD>1,200</TD> -</TR> -<TR> -<TH>Atlântico</TH> -<TD>87,000</TD> -<TD>3,900</TD> -</TR> -<TR> -<TH>Pacífico</TH> -<TD>180,000</TD> -<TD>4,000</TD> -</TR> -<TR> -<TH>Índico</TH> -<TD>75,000</TD> -<TD>3,900</TD> -</TR> -<TR> -<TH>Antártico</TH> -<TD>20,000</TD> -<TD>4,500</TD> -</TR> -</TBODY> - -<TFOOT> -<TR> -<TH>Total</TH> -<TD>361,000</TD> -<TD></TD> -</TR> -<TR> -<TH>Média</TH> -<TD>72,000</TD> -<TD>3,800</TD> -</TR> -</TFOOT> - -</TABLE> - -</BODY> -</HTML> -</pre> -</div> - -<p>Crie uma nova folha de estilo, <code>style3.css</code>. Copie e cole o conteúdo daqui, tendo certeza que você rolou a tela para pegar tudo isto:</p> - -<div style="width: 48em; height: 12em; overflow: auto;"> -<pre>/*** Estilo para doc3.html (Tabelas) ***/ - -#demo-table { - font: 100% sans-serif; - background-color: #efe; - border-collapse: collapse; - empty-cells: show; - border: 1px solid #7a7; - } - -#demo-table > caption { - text-align: left; - font-weight: bold; - font-size: 200%; - border-bottom: .2em solid #4ca; - margin-bottom: .5em; - } - - -/* basic shared rules */ -#demo-table th, -#demo-table td { - text-align: right; - padding-right: .5em; - } - -#demo-table th { - font-weight: bold; - padding-left: .5em; - } - - -/* header */ -#demo-table > thead > tr:first-child > th { - text-align: center; - color: blue; - } - -#demo-table > thead > tr + tr > th { - font-style: italic; - color: gray; - } - -/* fix size of superscript */ -#demo-table sup { - font-size: 75%; - } - -/* body */ -#demo-table td { - background-color: #cef; - padding:.5em .5em .5em 3em; - } - -#demo-table tbody th:after { - content: ":"; - } - - -/* footer */ -#demo-table tfoot { - font-weight: bold; - } - -#demo-table tfoot th { - color: blue; - } - -#demo-table tfoot th:after { - content: ":"; - } - -#demo-table > tfoot td { - background-color: #cee; - } - -#demo-table > tfoot > tr:first-child td { - border-top: .2em solid #7a7; - } -</pre> -</div> - -<p>Abra o documento no seu navegador. Deve ser muito similar a este:</p> - -<table style="border: 2px outset #36b; padding: 1em 6em 1em 1em; background-color: white;"> - <tbody> - <tr> - <td> - <div> - <p style="font: bold 200% sans-serif; text-align: left; border-bottom: .2em solid #4ca; margin: 0px 0px .5em 0px;">Oceanos</p> - - <div style="border: 1px solid #7a7; background-color: #efe;"> - <table style="font: 100% sens-serif; background-color: #efe; border-collapse: collapse; text-align: right; padding-right: .5em;"> - <tbody> - <tr style="text-align: center; color: blue;"> - <th> </th> - <th>Área</th> - <th style="padding-left: .5em; padding-right: .5em;">Profundidade média</th> - </tr> - <tr style="font-style: italic; color: gray;"> - <th> </th> - <th style="padding-left: .5em; padding-right: .5em;">milhões de km<sup>2</sup></th> - <th style="padding-left: .5em; padding-right: .5em;">m</th> - </tr> - <tr> - <th style="padding-right: .5em;">Ártico:</th> - <td style="background-color: #cef; padding: .5em .5em .5em 3em;">13,000</td> - <td style="background-color: #cef; padding: .5em .5em .5em 3em;">1,200</td> - </tr> - <tr> - <th style="padding-right: .5em;">Atlântico:</th> - <td style="background-color: #cef; padding: .5em .5em .5em 3em;">87,000</td> - <td style="background-color: #cef; padding: .5em .5em .5em 3em;">3,900</td> - </tr> - <tr> - <th style="padding-right: .5em;">Pacífico:</th> - <td style="background-color: #cef; padding: .5em .5em .5em 3em;">180,000</td> - <td style="background-color: #cef; padding: .5em .5em .5em 3em;">4,000</td> - </tr> - <tr> - <th style="padding-right: .5em;">Índico:</th> - <td style="background-color: #cef; padding: .5em .5em .5em 3em;">75,000</td> - <td style="background-color: #cef; padding: .5em .5em .5em 3em;">3,900</td> - </tr> - <tr> - <th style="padding-left: .5em; padding-right: .5em;">Antártico:</th> - <td style="background-color: #cef; padding: .5em .5em .5em 3em;">20,000</td> - <td style="background-color: #cef; padding: .5em .5em .5em 3em;">4,500</td> - </tr> - <tr> - <th style="padding-right: .5em; color: blue;">Total:</th> - <td style="background-color: #cee; padding: .5em .5em .5em 3em; border-top: .2em solid #7a7;">361,000</td> - <td style="background-color: #cee; padding: .5em .5em .5em 3em; border-top: .2em solid #7a7;"> </td> - </tr> - <tr> - <th style="padding-right: .5em; color: blue;">Média:</th> - <td style="background-color: #cee; padding: .5em .5em .5em 3em;">72,000</td> - <td style="background-color: #cee; padding: .5em .5em .5em 3em;">3,800</td> - </tr> - </tbody> - </table> - </div> - </div> - </td> - </tr> - </tbody> -</table> - -<p>Compare estas regras em sua folha de estilo com a tabela exibida, para se assegurar de que entende o efeito de cada regra. Se você achou uma regra com a qual não está seguro sobre, descomente-a e atualize o navegador para ver o que acontece.</p> - -<p>Aqui estão algumas notas sobre esta tabela:</p> - -<ul> - <li>O subtítulo encontra-se fora da borda da tabela.</li> - <li>Se você tiver um tamanho mínimo do ponto ajustado nas Opções, isto pode afetar o sobre-escrito no km<sup>2</sup>.</li> - <li>Existem três células vazias. Duas delas permitem que o fundo da tabela apareça através. A terceira tem um fundo e uma borda no topo.</li> - <li>As colunas são adicionadas pela folha de estilos.</li> -</ul> - -<table style="border: 1px solid #36b; padding: 1em; background-color: #fffff4; width: 100%;"> - <caption>Desafios</caption> - <tbody> - <tr> - <td>Mude a folha de estilo para fazer a tabela parecer com isto: - <table style="border: 2px outset #36b; padding: 1em 6em 1em 1em; background-color: white;"> - <tbody> - <tr> - <td> - <div> - <div style="border: 1px solid #7a7; background-color: #efe;"> - <table style="font: 100% sens-serif; background-color: #efe; border-collapse: collapse; text-align: right; padding-right: .5em;"> - <tbody> - <tr style="text-align: center; color: blue;"> - <th> </th> - <th>Área</th> - <th style="padding-left: .5em; padding-right: .5em;">Profundidade média</th> - </tr> - <tr style="font-style: italic; color: gray;"> - <th> </th> - <th style="padding-left: .5em; padding-right: .5em;">milhões de km<sup>2</sup></th> - <th style="padding-left: .5em; padding-right: .5em;">m</th> - </tr> - <tr> - <th style="padding-right: .5em;">Ártico:</th> - <td style="background-color: #cef; padding: .5em .5em .5em 3em; border: 1px solid #7a7;">13,000</td> - <td style="background-color: #cef; padding: .5em .5em .5em 3em; border: 1px solid #7a7; border-right: 0px;">1,200</td> - </tr> - <tr> - <th style="padding-right: .5em;">Atlântico:</th> - <td style="background-color: #cef; padding: .5em .5em .5em 3em; border: 1px solid #7a7;">87,000</td> - <td style="background-color: #cef; padding: .5em .5em .5em 3em; border: 1px solid #7a7; border-right: 0px;">3,900</td> - </tr> - <tr> - <th style="padding-right: .5em;">Pacífico:</th> - <td style="background-color: #cef; padding: .5em .5em .5em 3em; border: 1px solid #7a7;">180,000</td> - <td style="background-color: #cef; padding: .5em .5em .5em 3em; border: 1px solid #7a7; border-right: 0px;">4,000</td> - </tr> - <tr> - <th style="padding-right: .5em;">Índico:</th> - <td style="background-color: #cef; padding: .5em .5em .5em 3em; border: 1px solid #7a7;">75,000</td> - <td style="background-color: #cef; padding: .5em .5em .5em 3em; border: 1px solid #7a7; border-right: 0px;">3,900</td> - </tr> - <tr> - <th style="padding-left: .5em; padding-right: .5em;">Antártico:</th> - <td style="background-color: #cef; padding: .5em .5em .5em 3em; border: 1px solid #7a7;">20,000</td> - <td style="background-color: #cef; padding: .5em .5em .5em 3em; border: 1px solid #7a7; border-right: 0px;">4,500</td> - </tr> - <tr> - <th style="padding-right: .5em; color: blue;">Total:</th> - <td style="background-color: #cee; padding: .5em .5em .5em 3em; border-top: .2em solid #7a7;">361,000</td> - <td style="background-color: #cee; padding: .5em .5em .5em 3em; border-top: .2em solid #7a7;"> </td> - </tr> - <tr> - <th style="padding-right: .5em; color: blue;">Média:</th> - <td style="background-color: #cee; padding: .5em .5em .5em 3em;">72,000</td> - <td style="background-color: #cee; padding: .5em .5em .5em 3em;">3,800</td> - </tr> - </tbody> - </table> - </div> - - <p style="font: italic 100% sans-serif; text-align: right; border-top: .4em solid #4ca; margin: 1em 0px 0px 0px;">Oceanos</p> - </div> - </td> - </tr> - </tbody> - </table> - </td> - </tr> - </tbody> -</table> - -<h3 id="O_que_vem_depois.3F" name="O_que_vem_depois.3F">O que vem depois?</h3> - -<p>Se você teve dificuldade para entender esta página, ou se você tem algum comentário sobre ela, por favor combribua nesta página de <a href="/Talk:pt/CSS/Como_come%C3%A7ar/Tabelas" title="Talk:pt/CSS/Como_começar/Tabelas">Discussão</a>.</p> - -<p>Esta é a última página deste tutorial que foca as propriedades e valores das CSS. Para um sumário completo de propriedades e valores, veja <a class="external" href="http://www.w3.org/TR/CSS21/propidx.html">Full property table</a> em CSS Specification.</p> - -<p>A próxima página mostra novamente o propósito e a estrutura das folhas de estilo CSS: <strong><a href="/pt/CSS/Como_come%C3%A7ar/M%C3%ADdia" title="pt/CSS/Como_começar/Mídia">Mídia</a></strong></p> - -<p>{{ PreviousNext("CSS:Como começar:Disposição", "CSS:Como começar:Mídia") }}</p> |