![[HTML] 링크 선택자](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2Fb3Tmla%2FbtrpBCtr7ty%2FAAAAAAAAAAAAAAAAAAAAAOeaDLqjJsoCrlhbWgfIHDJ4prIdXGrWJcP9iriu4wLH%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1769871599%26allow_ip%3D%26allow_referer%3D%26signature%3DeeIYR3miMCU%252BOpYOxX%252FyW7vvXZU%253D)
개념
:link
href 속성을 가지고 있는 a 태그 선택
:visited
방문했던 링크를 가지고 있는 a 태그 선택
예제 1
<!DOCTYPE html>
<html>
<head>
<title>CSS3 Selector Basic</title>
<style>
a { text-decoration: none; }
a:visited { color: red; }
/* href 속성을 가지고 있는 a 태그의 뒤 공간에 "- (href 속성)"을 추가 */
a:link::after { content: ' - ' attr(href); }
</style>
</head>
<body>
<h1><a>Nothing</a></h1>
<h1><a href="http://hanb.co.kr">Hanbit Media</a></h1>
<h1><a href="http://www.w3.org/">W3C</a></h1>
<h1><a href="https://github.com/">Github</a></h1>
</body>
</html>
'HTML > Day39' 카테고리의 다른 글
| [HTML] float 속성 & clear 속성 & overflow 속성 (0) | 2022.01.02 |
|---|---|
| [HTML] 부정 선택자 (0) | 2022.01.02 |
| [HTML]문자 선택자 (0) | 2022.01.02 |
| [HTML] 동위 선택자 (0) | 2022.01.02 |
| [HTML] 문자열 속성 선택자 (0) | 2021.12.29 |