CSS를 통해서 어떻게 레이아웃을 잡고 사용하는지를 간단하게 보여준 예제...
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | UL { background: yellow; margin: 10px; padding: 5px; /* No borders set */}LI { color: white; /* text color is white */ background: blue; /* Content, padding will be blue */ margin: 10px; padding: 10px 0px 10px 10px;/* Note 0px padding right */ list-style: none /* no glyphs before a list item */ /* No borders set */}LI.withborder { border-style: dashed; border-width: medium; /* sets border width on all sides */ border-color: lime;} |
1 2 3 4 | <ul> <li>First element of list </li><li class="withborder">Second element of list is a bit longer to illustrate wrapping.</li></ul> |
