본문 바로가기
Web Programming/HTML CSS JAVASCRIPT

[CSS] 가상 클래스 선택자

가상 클래스 선택자






link : 방문한 적이 없는 링크

● visited : 방문한 적이 있는 링크 보안상 이유로 속성 사용이 제한적임

● hover : 마우스를 롤오버 했을 때

● active : 마우스를 클릭 했을 때



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
<style>
    a:hover{
        color:yellow;
    }
    a:active{
        color: green;
    }
</style>
 
</head>
<body>
    <a href="https://http://samdo0812.tistory.com/category">방문함</a>
    <a href="https://a.a">방문 안함</a>
</body>
</html>
cs


※ hover와 active가 동시에 적용 될 때(동급 일 때)

css는 뒷쪽에 있는 선언을 먼저 선택한다.

'Web Programming > HTML CSS JAVASCRIPT' 카테고리의 다른 글

[CSS] 캐스케이딩  (0) 2018.06.19
[CSS] 부모 자식 선택자  (0) 2018.05.09
[CSS] 선택자  (0) 2018.05.09
[JavaScript] 달력 만들기  (0) 2018.04.15
[JavaScript] 계산기  (0) 2018.04.15