div {
border: 1px solid black;
padding: 5px;
margin: 5px 10px;
background-color: pink;
}
.ex1:hover {outline: medium solid red;}
.ex2:hover {outline: 10px dotted rgba(255,0,0,0.3);}
div:hover {
outline-offset : 5px;
}
<!DOCTYPE html>
<html lang="ko">
<head></head>
<body>
<p>요소에 마우스를 올리세요</p>
<div class="ex1">outline: medium solid red;</div>
<div class="ex2">outline: 10px dotted rgba(255,0,0,0.3);</div>
</body>
</html>