从图像html中删除选定的轮廓[重复]

Question

所以我有一个徽标轮播。每当我单击其中一个徽标时，都会出现黑色轮廓。意味着它被选中。我已经尝试过使用

img::selection {
background: transparent;

}

但它并没有真正起作用。我想删除那个黑色轮廓选择。这是一个外观示例。

Image of the problem

这是我的实际代码。

HTML

<section class="customer-logos slider pb-5">
        <div class="slide"><img src="logos_clientes/img1.png"></div>
        <div class="slide"><img src="logos_clientes/img2.png"></div>
        <div class="slide"><img src="logos_clientes/img3.png"></div>
        <div class="slide"><img src="logos_clientes/img4.png"></div>
        <div class="slide"><img src="logos_clientes/img5.png"></div>
        <div class="slide"><img src="logos_clientes/img6.png"></div>
        <div class="slide"><img src="logos_clientes/img7.png"></div>
     </section>

CSS

.slick-slide {
    margin: 0px 20px;
  }
  .slick-slide img {
      width: 100%;
  }
  .slick-slider
  {
      position: relative;
      display: block;
      box-sizing: border-box;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      -webkit-touch-callout: none;
      -khtml-user-select: none;
      -ms-touch-action: pan-y;
      touch-action: pan-y;
      -webkit-tap-highlight-color: transparent;
  }
  .slick-list
  {
      position: relative;
      display: block;
      overflow: hidden;
      margin: 0;
      padding: 0;
  }
  .slick-list:focus
  {
      outline: none;
  }
  .slick-list.dragging
  {
      cursor: pointer;
      cursor: hand;
  }
  .slick-slider .slick-track,
  .slick-slider .slick-list
  {
      -webkit-transform: translate3d(0, 0, 0);
         -moz-transform: translate3d(0, 0, 0);
          -ms-transform: translate3d(0, 0, 0);
           -o-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
  }
  .slick-track
  {
      position: relative;
      top: 0;
      left: 0;
      display: block;
  }
  .slick-track:before,
  .slick-track:after
  {
      display: table;
      content: '';
  }
  .slick-track:after
  {
      clear: both;
  }
  .slick-loading .slick-track
  {
      visibility: hidden;
  }
  .slick-slide
  {
      display: none;
      float: left;
      height: 100%;
      min-height: 1px;
  }
  [dir='rtl'] .slick-slide
  {
      float: right;
  }
  .slick-slide img
  {
      display: block;
  }
  .slick-slide.slick-loading img
  {
      display: none;
  }
  .slick-slide.dragging img
  {
      pointer-events: none;
  }
  .slick-initialized .slick-slide
  {
      display: block;
  }
  .slick-loading .slick-slide
  {
      visibility: hidden;
  }
  .slick-vertical .slick-slide
  {
      display: block;
      height: auto;
      border: 1px solid transparent;
  }
  .slick-arrow.slick-hidden {
      display: none;
  }

抱歉，代码太长了。我希望有人可以帮助我删除黑色轮廓？谢谢！

Answer 1

如果您这样做，您的问题可以解决（也可以尝试添加!important）：

.slick-active {
  outline: none;
}

或

.slick-slide {
  outline: none;
}

或

.slick-slide:active {
  outline: none;
}