Html에서 가상 클래스 선택자 (호버링)

개발자노트/웹

Html에서 가상 클래스 선택자 (호버링)

hansummer 2022. 7. 22. 00:48

마우스 호버링 : 웹에서 마우스를 올리면 반응하는 것

ex) 링크가 걸려있는 글자나 이미지에 마우스를 올리면 색이 변함

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>가상 클래스 선택자</title>
<style type="text/css">
	a{
		color: black;
	}
	a:hover{ /*마우스 호버링== 마우스를 올려놓으면 반응함*/
		color: red;
	}


</style>
</head>
<body>

<ul>
	<li><a href="#">상의</a></li>
	<li><a href="#">하의</a></li>
	<li><a href="#">치마</a></li>
	<li><a href="#">신발</a></li>
</ul>


</body>
</html>