border
css에서 아주 중요한 역활을 해주는 녀석중 하나입니다.
table border="1" 이런거 자주보셨을겁니다. css에서 border는 다양한 확장성을 가지고 있습니다. 옵션으루...


일단 속성별로 하나씩 보도록 하겠습니다.
첫번 째로는 방향별로 주는 속성입니다.
border-top : 윗쪽모양을 내는데 사용
border-left : 왼쪽
border-right: 오른쪽
border-bottom : 아랫쪽

또한 방향별로 스타일을 줄수도 있습니다.
border-top-style:dotted;
border-bottom-style:solid;
border-left-style:grrove;
border-right-style:outset;
또 응용한다면 많겠죠,


사용방법은 ? 여기서 H라는 클래스로 이용해보겠습니다.
div.h{ border-left:#000000 solid; }

테스트

왼쪽에 테두리가 나온것을 볼 수 있습니다.

따로 굵기만 설정하는 기능도있습니다.
border-width <- 요녀석인데요.
border-width:5px; 이런식으로 사용합니다.

border 속성은 한번에 3개의 값을 넣어서 두꼐를 지정할 수 있는데요.
div.h{ border:3px #000000 solid; }
border : 3px(두께를 3픽셀로) solid(스타일,실선) #000000(색상)
3픽셀의 크기와 실선스타일로 border가 생긴것을 볼 수 있습니다.

응용하신다면 무궁무진합니다. div, h, a, span, li 별별 스타일이 들어가는곳엔 다 쓸수 있습니다.
일단 예를 하나 들자면,
<style type="text/css">
   div.test a:link{ border:0px; }
   div.test a:visited { border:0px; }
   div.test a:hover { border:2px # }
</style>

이런식으로 한다면은 링크위에 마우스를 올렸을 때 테두리가 나타나는 모습입니다.
정말 응용한다면 페이징시에도 멋진 링크를 만들 수 있습니다^^
 모르시는분들을 위해서 한번 올려봤습니다.
새해복 많이받으십쇼(__) 꾸벅