Css 当您将鼠标悬停在文本上时，如何更改文本而不使其抖动？

据我所知，CSS可用于以基本方式更改

：hover

上元素的内容。我正在使用这个代码

HTML:

但当我把鼠标悬停在按钮上时，它会剧烈地抽动

我希望我的音乐像音乐播放器一样流畅

当您将鼠标悬停在

lease

、

premium

或

trackout

price下的一个按钮上时，它们将切换到

+添加

文本

---

这是我的播放器的一部分

重要的是确保悬停时布局不会改变。实现这一点的最简单方法是在布局中为所有零件分配一些空间，即使不悬停。我不确定您想要实现什么样的布局，但这里有一个示例：

button { width: 6em }
button:hover span {display:none}
button:before { width: 100px; content: ""; }
button:hover:before {content: "Reply!"}

---

通过给

：before

伪元素一个大小，即使它没有悬停，当内容改变时布局也不应该改变。您可能需要针对所需的特定布局进行调整，但一般原则是确保所有与尺寸相关的属性都是在没有

的情况下指定的：悬停
，然后只调整非布局属性（即不影响任何框尺寸的属性）在
：hover
状态下。
当您提供链接时，链接将悬停在背景图像上，但在测试链接中，您之前已经为
元素提供了背景图像，如果您希望与链接完全相同，请使用
背景图像：url（'image1'）到
a
和
背景图像：url（'image2'）到
a：悬停

您仍然可以使用定位背景图像，为此您应该像这样

+--------------+
|              |    position this background to a
+--------------+
|    + Add     |    position this background to a:hover
+--------------+

好的！为此，将背景宽度设为64像素，高度设为32像素。
然后将你的背景定位到
a{background image:url（'image'）左上方不重复；背景位置：0%100%；}

现在将您的背景定位到

a:hover{background-position: 0% 0%;}

我想我有一个解决办法。关键在于：设置文本容器的宽度。我还使用onmouseenter而不是onmouseover来更快地更改文本（我的理论是onmouseenter比onmouseover更快）。以下是一个例子：


var视频播放器={
文字：“你好，世界”，
作者：“（你）
}
（将鼠标悬停在我身上）
你的链接似乎没有为我抖动，这也没有：链接是他想要的东西的一个例子，是我的播放器的一部分。你能看到你是否能使它平滑文本更改鼠标悬停我不使用按钮的图像我使用css按钮我如何编辑我当前的代码？我应该把a:hover类放在哪里？如果我使用css按钮，我应该使用什么图像？
a:hover{background-position: 0% 0%;}