文字をhoverすると画像が表示されるようにする

<template>
 <div>
  <p>
   <a href="#" class="Art__viewer">Test
    <span><img src="~@/assets/images/Main/****.jpg" alt=""></span>
   </a>
  </p>
 </div>
</template>

<style>
.Art__viewer:hover {
  position: relative;
    text-decoration: none;
}
.Art__viewer span {
  display: none;
    position: absolute;
    top: -200px;
    left: 150px;
}
.Art__viewer:hover span {
    border: none;
    display: block;
    width: 210px;
}
</style>