English | česky | >> Português <<ZVON > Tutorials > CSS2 tutorial
Introdução / Procura / ZVON
>> Exemplo 53 << | Anterior | Próximo | Index | Conteúdos

Caixas posicionadas de forma absoluta sáo retiradas do fluxo normal. Isto significa que não têm impacto na posição das caixas seguintes.

Documento XMLfolha de estilos CSSExemplo de ligação
(1)
     <XXX>
          <AAA>aaa aaa aaa aaa</AAA>
          <BBB>bbb</BBB>
          <CCC>ccc ccc ccc ccc ccc</CCC>
          <DDD>ddd ddd ddd ddd</DDD>
          <EEE>eee eee eee ee eeee eeee</EEE>
     </XXX>
BBB {display:block; position:absolute; left:12ex;
color:red; font-weight:bold}
Ver resultado
Documento XMLfolha de estilos CSSExemplo de ligação
(2)
     <XXX>
          <AAA>aaa aaa aaa aaa</AAA>
          <BBB>bbb</BBB>
          <CCC>ccc ccc ccc ccc ccc</CCC>
          <DDD>ddd ddd ddd ddd</DDD>
          <EEE>eee eee eee ee eeee eeee</EEE>
     </XXX>
AAA {display:block; position:absolute; left:100px;
right:100px;top:10px; color:red; font-weight:bold}
CCC {display:block; position:absolute; left:10px;
right:200px; top:100px; color:purple; font-weight:bold}
DDD {display:block; position:absolute; left:200px;
right:10px; top:3em; color:green; font-weight:bold}
EEE {display:block; position:absolute; left:100px;
right:100px; top:240px; color:navy; font-weight:bold}
Ver resultado
Documento XMLfolha de estilos CSSExemplo de ligação
(3)
     <XXX>
          <AAA>aaa aaa aaa aaa</AAA>
          <BBB>bbb</BBB>
          <CCC>ccc ccc ccc ccc ccc</CCC>
          <DDD>ddd ddd ddd ddd</DDD>
          <EEE>eee eee eee ee eeee eeee</EEE>
     </XXX>
AAA {display:block; position:absolute; left:145px;
right:145px;bottom:10px; color:red; font-weight:bold}
Ver resultado