如何在悬停时突出显示元素内的文本，而不是整个元素及其填充？CSS/HTML

要在悬停时突出显示元素内的文本，而不是整个元素及其填充，可以使用CSS和HTML来实现。以下是一种常见的实现方式：

HTML部分：

<div class="container">
  <span class="highlight">Hello World</span>
</div>

CSS部分：

.container {
  position: relative;
  display: inline-block;
}

.highlight {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  background-color: rgba(0, 0, 0, 0.5);
  padding: 5px;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.3s linear;
}

.container:hover .highlight {
  visibility: visible;
  opacity: 1;
}

上述代码使用了一个父容器 .container 包裹一个带有文本的子元素 .highlight。通过设置 .container 的 position 属性为 relative，使得 .highlight 的 position 属性相对于父容器进行定位。

在正常状态下，.highlight 的 visibility 属性被设置为 hidden，opacity 属性被设置为 0，使其在页面中不可见。当鼠标悬停在 .container 上时，使用 .container:hover .highlight 选择器，将 .highlight 的 visibility 属性设置为 visible，opacity 属性设置为 1，使其在页面中显示出来。

此外，还可以通过设置 .highlight 的背景颜色、字体颜色等属性来进一步自定义突出显示的效果。

这种方法适用于任何 HTML 元素，并且可以根据需要进行自定义样式。腾讯云相关产品和链接地址暂不提供，请根据需要自行搜索相关产品。