时间戳

首页 > 解决方案 > 删除具有重叠 png 按钮图像的按钮残留物

javascript - 删除具有重叠 png 按钮图像的按钮残留物

问题描述

我有两个箭头，它们都是按钮和重叠滚动条的 png 图像。除了这两个在我设置箭头样式时似乎不会移动/消失的小方块之外，箭头还可以工作。它们似乎是箭头留下的空按钮。我需要小方块消失，并尝试了边框：无和背景颜色：透明，但这些和其他 css 命令似乎只适用于箭头，而不适用于底部的小框。帮助！

按钮 html 和 css：

    <button onclick="scrollMe('left')"> <img id="arrowL" src='../static/imj/arrowLeft.png' > </button>
      <button onclick="scrollMe('right')"> <img id="arrowR" src='../static/imj/arrowRight.png'> </button>

#arrowL{
    width: 7%;
    position: absolute;
    left: 9px;
    top: 812px;
    z-index: 3;
}
#arrowR{
    width: 7%;
    position: absolute;
    left: 657px;
    top: 812px;
    z-index: 3;
}'

两个框 - 人物滚动条下方的灰白色

标签： javascripthtmlcss

解决方案

您的 CSS 样式仅适用于这些img元素ids上的元素

要设置按钮的样式，您可以使用类似的类.arrow-button，例如

<button onclick="scrollMe('left')" class="arrow-button"> <img id="arrowL" src='../static/imj/arrowLeft.png' > </button>
<button onclick="scrollMe('right')" class="arrow-button"> <img id="arrowR" src='../static/imj/arrowRight.png'> </button>

//CSS
.arrow-button {
    background-color:transparent;
    border:none;
}

推荐阅读