如何删除悬停在图像上时出现的缩放图标？

Question

我正在使用这个引导主题的网站上工作.当鼠标悬停在任何图像上时,会出现缩放图标 - 如何将其删除？

我尝试删除class="zoomIcon"并查看此网站以及在Google上搜索.

HTML:

<div class="product-main-image-container">
  <img src="../../images/products/prod1.png" alt="" class="product-loader" style="display: none;">
  <span class="thumbnail product-main-image" style="position: relative; overflow: hidden;">
    <img src="../../images/products/prod1.png" alt="">
    <img src="../../images/products/prod1.png" class="zoomImg" 
         style="position: absolute; top: -0.0456852791878173px; left: -1.23350253807107px; opacity: 0; width: 400px; height: 400px; border: none; max-width: none; max-height: none;">
  </span>
</div>

Answer 1

您可以将其添加到CSS:

<style>
img:hover {
cursor: default;
}
</style>

我希望这对你有所帮助!

Answer 2

您可以通过修改使其发生的 CSS（它看起来像一个名为 style.css 的 CSS 文件）或编写您自己的规则来使其停止来覆盖此光标行为。

该规则位于.product-main-imagestyle.css 文件的第 432 行，要覆盖它，您需要这样的规则：

.product-main-image{cursor:default;}或您想要的任何其他光标样式