Front-End - Main Menu/html5 + CSS3 + JavaScript (종합 예제)

ex09_01 - HTML 태그에 이벤트리스너 작성

ITRecipe 2023. 2. 23. 12:23
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>이벤트를 태그에서 처리</title>
</head>
<body>

<h3>HTML 태그에 이벤트리스너 작성</h3>
<hr/>

<!-- 시작태그의 이벤트리스너 속성은 on이벤트명으로 값을 JS코드를 사용한다. -->
<p onmouseover = "this.style.backgroundColor='orchid'"
   onmouseout = "this.style.backgroundColor='white'">
   마우스를 올리면 orchid 색상으로 변경되며, 때면 while색상으로 변경된다.
</p>

</body>
</html>