如何阻止Hue更改圖像邊框顏色Javascript

Question

我目前正在制作一個程序，允許您隨意更改圖像屬性。 每當我更改圖像色調時，它也會更改圖像邊框顏色（如果有的話）。 有什么方法可以避免這種情況並使邊框顏色保持其設置的原樣？ 我真的沒有嘗試過任何東西，因為互聯網上沒有任何東西，我也不知道該如何解決。

Answer 1

您可以將圖像包裝在相同大小的容器中。 將過濾器應用於此容器內的元素，然后在容器上設置邊框。

 .container { border: 16px solid red; width: 256px; height: 256px; } .container img { filter: hue-rotate(90deg); -webkit-filter: hue-rotate(90deg); } 

 <div class="container"> <img src="https://picsum.photos/id/888/256/256"> </div>