>> English << | česky | PortuguêsZVON > Tutorials > CSS2 tutorial
Intro / Search / ZVON
>> Example 15 << | Prev | Next | Index | Contents

The margin, border, and padding can be broken down into left, right, top, and bottom segments. (1) uses different borders, (2) uses paddings.

XML SourceCSS stylesheetExample link
(1)
     <AAA>
          <BBB>bbb</BBB>
          <CCC>ccc</CCC>
          <DDD>ddd</DDD>
     </AAA>
BBB {border-style:solid; border-top-width:thick; border-left-width:thick;
border-right-width:thin; border-bottom-width:medium;}
CCC {border-style:solid; border-top-color:red; border-left-color:blue;
border-right-color:green; border-bottom-color:black;}
DDD {border-width: thick; border-top-style:dotted; border-left-style:double;
border-right-style:groove; border-bottom-style:inset;}
View output
XML SourceCSS stylesheetExample link
(2)
     <AAA>
          <BBB>bbb</BBB>
          <CCC>ccc</CCC>
          <DDD>ddd</DDD>
     </AAA>
BBB, CCC, DDD {border-style:solid; padding-top:5px; padding-left:10px;
padding-right:30px; padding-bottom:5px;}
View output