[css] a 태그(Tag) 속성 (link, visited, active, hover) 사용하는 방법
반응형
[css] a 태그(Tag) 속성 (link, visited, active, hover) 사용하는 방법
이전에 a 태그(Tag) 속성에 대해서 배웠는데,
보통 문서를 링크 시키기 위해 a 태그(Tag) 를 많이 사용 한다.
[html] a 태그(tag) 속성 (href, target, title) 사용하는 방법
이번에는 a 태그(Tag) 의 다양한 스타일 속성에 대해서 알아 보자.
<a> 태그(Tag) 의 속성 사용법
a:link : 방문 전 링크 상태이다.
a:visited : 방문 후 링크 상태이다.
a:hover : 마우스 오버 했을 때 링크 상태이다.
a:active : 클릭 했을 때 링크 상태이다.
순서가 바뀌면 스타일이 제대로 적용되지 않기 때문에 스타일 적용 순서는 위 순서대로 해야 한다.
기본 html 소스
실행 결과는 다음과 같다.
<a:link - 방문 전 링크 상태>
<a:hover - 마우스 오버 했을 때 링크 상태>
<a:active - 클릭 했을 때 링크 상태>
<a:visited - 방문 후 링크 상태>
참고로 a 태그(Tag) 는 밑줄 스타일 속성이 기본으로 적용 되어 있다.
밑줄 스타일 속성을 제거 하고 싶을 때는 다음과 같이 text-decoration 스타일 속성을 none 으로 지정 하면 된다.
a { text-decoration: none; }
반응형
'develop > css' 카테고리의 다른 글
| [css] overflow-x 와 overflow-y 의 속성 (0) | 2017.10.24 |
|---|---|
| [css] overflow (visible, hidden, scroll, auto) 속성 (0) | 2017.10.23 |
| [css] 여백 (margin, padding) 속성 (0) | 2017.09.26 |
| [css] position (static, relative, absolute, fixed) 의 속성 (1) | 2017.09.25 |
| [css] clear(none, both, left, right) 의 속성 (0) | 2017.09.24 |
TAGS.