<a href="/" aria-label="赞">
  <svg class="heart" width="24" height="24" viewBox="0 0 24 24" role="img" focusable="false" aria-hidden="true">
    <path d="M12,21.35L10.55,20.03C5.4,15.36 2,12.27 2,8.5C2,5.41 4.42,3 7.5,3C9.24,3 10.91,3.81 12,5.08C13.09,3.81 14.76,3 16.5,3C19.58,3 22,5.41 22,8.5C22,12.27 18.6,15.36 13.45,20.03L12,21.35Z"></path>
  </svg>
</a>

<a href="/" aria-labelledby="foo">
  <svg class="heart" width="24" height="24" viewBox="0 0 24 24" role="img" focusable="false" aria-hidden="true">
    <path d="M12,21.35L10.55,20.03C5.4,15.36 2,12.27 2,8.5C2,5.41 4.42,3 7.5,3C9.24,3 10.91,3.81 12,5.08C13.09,3.81 14.76,3 16.5,3C19.58,3 22,5.41 22,8.5C22,12.27 18.6,15.36 13.45,20.03L12,21.35Z"></path>
  </svg>
</a>

<a href="/" aria-describedby="foo">
  <svg class="heart" width="24" height="24" viewBox="0 0 24 24" role="img" focusable="false" aria-hidden="true">
    <path d="M12,21.35L10.55,20.03C5.4,15.36 2,12.27 2,8.5C2,5.41 4.42,3 7.5,3C9.24,3 10.91,3.81 12,5.08C13.09,3.81 14.76,3 16.5,3C19.58,3 22,5.41 22,8.5C22,12.27 18.6,15.36 13.45,20.03L12,21.35Z"></path>
  </svg>
  
</a>

<a href="/">
  <svg class="heart" width="24" height="24" viewBox="0 0 24 24" role="img" focusable="false" aria-hidden="true">
    <path d="M12,21.35L10.55,20.03C5.4,15.36 2,12.27 2,8.5C2,5.41 4.42,3 7.5,3C9.24,3 10.91,3.81 12,5.08C13.09,3.81 14.76,3 16.5,3C19.58,3 22,5.41 22,8.5C22,12.27 18.6,15.36 13.45,20.03L12,21.35Z"></path>
  </svg>
  <span class="sr-only">赞</span>
</a>

<p id="foo">赞</p>
body {
  background-color: #FDF1F2;
  width: 100vw;
  min-height: 100vh;
  
  display: flex;
  justify-content: center;
  align-items: center;
}

svg {
  width:50vh;
  height: 50vh;
  fill: #EA442B;
}
a:hover {
  text-decoration: none;
  filter: drop-shadow(2px 2px 3px rgba(0,0,0,.6))
}

#foo,
.sr-only {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.