html - 如何制作悬停命令 = 悬停时的形状？

Question

我的想法是在有人将鼠标悬停之前使用普通文本，然后我想要一个形状(理想情况下我会将其作为 .svg 从 Illustrator 中导入)。因此，当有人将鼠标悬停在“单击此处”上时，会出现一个形状，而不仅仅是颜色或不透明度的变化。

这可以使用 HTML 和 CSS 完成吗？

Answer 1

你可以玩这样的东西:

.foo{
  width: 200px;
  background-color: blue;
  color: white;
  transition: background-color 1s ease;
}

.foo:hover{
      text-indent: -9999px;
      background-color: red;
      height: 200px;
      border-radius: 50%;    
}

<div class="foo">
click here
</div>

如果您需要进一步的帮助，只需发布​​您想要的更多详细信息即可。