형식) tag(혹은 id 혹은 class):hover { 디자인 내용 };
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
.photo {
opacity: 0.5; /*투명도 속성*/
}
/*이미지 태그에 마우스가 올라갔을 때 디자인 적용 */
.photo:hover {
opacity: 1;
}
</style>
</head>
<body>
<img class="photo" src="images/img.jpg" alt="튤립 이미지">
</body>
</html>
'Front > CSS' 카테고리의 다른 글
| [CSS] :before :after 삭제(가상 요소 반응형 웹에서만 삭제하기) (0) | 2021.07.27 |
|---|---|
| [CSS3] 반응형 웹(Responsive Web) 기초 (0) | 2021.04.29 |
| [CSS3] 그림자(shadow) 속성 (0) | 2021.04.22 |
| [CSS3] border선, 사각형 둥글게 만들기 (0) | 2021.04.22 |
| [CSS3] float 속성 (0) | 2021.04.22 |
