Untitled

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>My_code</title>
  <link rel="stylesheet" type="text/css" href="style.css">
<style>
* {
  margin: 0;
  position: 0;
}

.wrapper {
  padding: 50px;
}

.link {
 display: block;
 padding: 12px 24px;
 text-decoration: none;
 background: darkorange;
 width: 100px;
 color: white;
}

.link:hover {
  background: red;
  cursor: pointer;
}

.lonk:hover > .list:hover {
  display: block;
}


.list {
  list-style: none;
  display: none;

}

.item {
  display: block;
  padding: 12px 24px;
  width: 100px;
  background: darkorange;
  color: white;
}

.item:hover {
  cursor: pointer;
  background: red;
}


</style>
</head>
<body>


<div class="wrapper">
  <a class="link" href="#">Показать</a>
  <ul class="list">
    <li class="item">First</li>
    <li class="item">Second</li>
    <li class="item">Third</li>
  </ul>
</div>


</body>
</html>