English | česky | >> Português <<ZVON > Tutorials > CSS2 tutorial
>> Exemplo 42 << | Anterior | Próximo | Index | Conteúdos

As legendas das tabelas podem ser colocadas por cima ("top" - 1), por baixo ("bottom" - 2), à esquerda ("left" - 3) ou à direita ("right" - 4).

Documento XMLfolha de estilos CSSExemplo de ligação
(1)
     <AAA>
          <XXX>xxxx</XXX>
          <BBB>
               <CCC>ccc1</CCC>
               <DDD>ddd1</DDD>
               <EEE>eee1</EEE>
          </BBB>
          <BBB>
               <CCC>ccc2</CCC>
               <DDD>ddd2</DDD>
               <EEE>eee2</EEE>
          </BBB>
     </AAA>

AAA {display: table}
XXX {display:table-caption; color:red; caption-side:top }
BBB {display: table-row}
CCC {display: table-cell}
DDD {display: table-cell}
EEE {display: table-cell}
Ver resultado
Documento XMLfolha de estilos CSSExemplo de ligação
(2)
     <AAA>
          <XXX>xxxx</XXX>
          <BBB>
               <CCC>ccc1</CCC>
               <DDD>ddd1</DDD>
               <EEE>eee1</EEE>
          </BBB>
          <BBB>
               <CCC>ccc2</CCC>
               <DDD>ddd2</DDD>
               <EEE>eee2</EEE>
          </BBB>
     </AAA>

AAA {display: table}
XXX {display:table-caption; color:red; caption-side:bottom }
BBB {display: table-row}
CCC {display: table-cell}
DDD {display: table-cell}
EEE {display: table-cell}
Ver resultado
Documento XMLfolha de estilos CSSExemplo de ligação
(3)
     <AAA>
          <XXX>xxxx</XXX>
          <BBB>
               <CCC>ccc1</CCC>
               <DDD>ddd1</DDD>
               <EEE>eee1</EEE>
          </BBB>
          <BBB>
               <CCC>ccc2</CCC>
               <DDD>ddd2</DDD>
               <EEE>eee2</EEE>
          </BBB>
     </AAA>

AAA {display: table}
XXX {display:table-caption; color:red;
caption-side:right; width:5em }
BBB {display: table-row}
CCC {display: table-cell}
DDD {display: table-cell}
EEE {display: table-cell}
Ver resultado
Documento XMLfolha de estilos CSSExemplo de ligação
(4)
     <AAA>
          <XXX>xxxx</XXX>
          <BBB>
               <CCC>ccc1</CCC>
               <DDD>ddd1</DDD>
               <EEE>eee1</EEE>
          </BBB>
          <BBB>
               <CCC>ccc2</CCC>
               <DDD>ddd2</DDD>
               <EEE>eee2</EEE>
          </BBB>
     </AAA>

AAA {display: table}
XXX {display:table-caption; color:red;
caption-side:left; width:5em }
BBB {display: table-row}
CCC {display: table-cell}
DDD {display: table-cell}
EEE {display: table-cell}
Ver resultado