English | >> česky << | PortuguêsZVON > Tutorials > CSS2 tutorial
>> Příklad 3 << | Předešlý | Následující | Index | Obsah

Jména oddělená "whitespace" znaky specifikují elementy, pro které platí, jejich jméno je stejné jako poslední jméno v této posloupnosti a ostatní jména se vyskytují někde "na cestě" od kořenového elementu k tomuto elementu. Jinými slovy, jsou to předci tohoto elementu ("ancestors") (1). Když jsou jména elementů separována znakem "větší než" [>], tak element napravo musí být přímým potomkem ("child") elementu nalevo (2). Znaku hvězdička [*] můžeme použít pro dosažení některých zajímavých efektů. V (3) jsou vnuci elementu AAA zbarveni červeně. Element ddd2 je také zbarven červeně - přestože není vnukem, protože podědí barvu z otce.

XML dokumentCSS stylOdkaz na příklad
(1)
     <AAA>
          <BBB>
               <DDD>ddd1
                    <DDD>ddd2</DDD>
               </DDD>
          </BBB>
          <CCC>
               <DDD>ddd3</DDD>
          </CCC>
          <DDD>ddd4</DDD>
          <OOO>
               <PPP>
                    <RRR>rrr1</RRR>
               </PPP>
          </OOO>
          <RRR>rrr2</RRR>
     </AAA>

AAA CCC DDD {color:blue}
BBB DDD {color:maroon}
OOO RRR {color:red}
Zobraz výstupy
XML dokumentCSS stylOdkaz na příklad
(2)
     <AAA>
          <BBB>
               <DDD>ddd1
                    <DDD>ddd2</DDD>
               </DDD>
          </BBB>
          <CCC>
               <DDD>ddd3</DDD>
          </CCC>
          <DDD>ddd4</DDD>
          <OOO>
               <PPP>
                    <RRR>rrr1</RRR>
               </PPP>
          </OOO>
          <RRR>rrr2</RRR>
     </AAA>

AAA > CCC > DDD {color:blue}
BBB > DDD {color:maroon}
OOO > RRR {color:red}
Zobraz výstupy
XML dokumentCSS stylOdkaz na příklad
(3)
     <AAA>
          <BBB>
               <DDD>ddd1
                    <DDD>ddd2</DDD>
               </DDD>
          </BBB>
          <CCC>
               <DDD>ddd3</DDD>
          </CCC>
          <DDD>ddd4</DDD>
          <OOO>
               <PPP>
                    <RRR>rrr1</RRR>
               </PPP>
          </OOO>
          <RRR>rrr2</RRR>
     </AAA>

AAA > * > * {color:red}
Zobraz výstupy