a {
color: #333;
text-decoration: none;
width: 120px
text-align: center;
display: inline-block;
padding: 5px;
border-radius: 5px;
transition: 0.5s;
}
a:hover {
background-color: #000;
color: white;
}
transition은 애니메이션 적용까지 걸리는 시간을 의미한다.
반드시 본 클래스 스타일에 지정해줘야한다.가상 클래스 hover는 클래스 옆에 콜론을 붙이고 명시한다.
클래스명과 콜론과 가상클래스 사이에 공백을 사용해서는 안된다.마우스가 올라갔을 때 적용되는 스타일이다.