[CSS] Hover의 재발견

평소 a:hover 라고 많이 사용할 것이다.
링크에 마우스를 올렸을때 뭐 색이 변하거나 할 수 있게 되는데..

이게 a태그에만 적용한 것이 아니다.

div나 tr에도 적용이 가능하다.


그동안 TR에 마우스를 올렸을때 스타일을 먹이려고 하면 일일히 onMouseOver, onMouseOut를 이용하곤 했지만 단순히 CSS를 이용하면

<style>
tr:hover{
}
</style>

이렇게만 하면 된다.


테이블을 thead, tbody, tfoot로 이름을 지어서 나눠서 만들게 되는데 이것은 W3C의 표준권고사항이니 테이블을 만들때는 이와같은 구조로 하는것이 좋다.

이 중에 tbody의 tr 태그에만 스타일즐 주고 싶다면
> 를 사용한다.

a>b{
}

는 "a에 포함되어있는 객체들 중 b"라는 뜻이다.

그래서 단순히 다음과 같이 해주면 된다.

tbody > tr:hover

출처 : 물결님의 블로그(http://asrada2001.mireene.com/?page=4)