CSS를 통해서 어떻게 레이아웃을 잡고 사용하는지를 간단하게 보여준 예제...
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;
}
- First element of list
- Second element of list is a bit longer to illustrate wrapping.
