html - 为什么在测试我的这个 HTML 页面时“将图像另存为”在浏览器上不起作用？

Question

这是我的克隆脚本代码：

https://jsfiddle.net/5cpgw7to/

我遇到问题的部分是：

<article data-standout-type="" class="product-card ">

    <div class="product-card__inner">


    <section class="product-card-image ">
        <img class="product-card-image__image product-card-image__main-image" alt="" srcset="
https://m.atcdn.co.uk/a/media/w262h198pf7f7f5/37d9a0bae08748bc961dc42cd1421f7c.jpg 262w,
https://m.atcdn.co.uk/a/media/w340h255pf7f7f5/37d9a0bae08748bc961dc42cd1421f7c.jpg
             " sizes="
                (max-width: 1024px) 262px,
                340px
             " src="https://m.atcdn.co.uk/a/media/w340h255pf7f7f5/37d9a0bae08748bc961dc42cd1421f7c.jpg" loading="lazy" data-label="search appearance click ">

            <div class="product-card-image__thumbnails">
                   <img class="product-card-image__image" loading="lazy" data-label="search appearance click " srcset="
https://m.atcdn.co.uk/a/media/w84h63pf7f7f5/f84e7caf0cb247cfb44ed47a4c935154.jpg 84w,
https://m.atcdn.co.uk/a/media/w108h81pf7f7f5/f84e7caf0cb247cfb44ed47a4c935154.jpg
                        " sizes="
                            (max-width: 1024px) 84px,
                            108px
                        " src="https://m.atcdn.co.uk/a/media/w108h81pdfdfdf/f84e7caf0cb247cfb44ed47a4c935154.jpg" alt="">
                                  <img class="product-card-image__image" loading="lazy" data-label="search appearance click " srcset="
https://m.atcdn.co.uk/a/media/w84h63pf7f7f5/9ac214f88a934d16b32de99d2bff906f.jpg 84w,
https://m.atcdn.co.uk/a/media/w108h81pf7f7f5/9ac214f88a934d16b32de99d2bff906f.jpg
                        " sizes="
                            (max-width: 1024px) 84px,
                            108px
                        " src="https://m.atcdn.co.uk/a/media/w108h81pdfdfdf/9ac214f88a934d16b32de99d2bff906f.jpg" alt="">
                                  <img class="product-card-image__image" loading="lazy" data-label="search appearance click " srcset="
https://m.atcdn.co.uk/a/media/w84h63pf7f7f5/d23523bd74fb40969ba76e57bd0afbe9.jpg 84w,
https://m.atcdn.co.uk/a/media/w108h81pf7f7f5/d23523bd74fb40969ba76e57bd0afbe9.jpg
                        " sizes="
                            (max-width: 1024px) 84px,
                            108px
                        " src="https://m.atcdn.co.uk/a/media/w108h81pdfdfdf/d23523bd74fb40969ba76e57bd0afbe9.jpg" alt="">
               
            </div>
    </section>

由于某种原因，最终用户无法保存图像，并且 CSS 中的 user-select 属性未禁用。

我该如何解决这个问题并确保用户可以将图像保存在 CSS 中？

在 Mac 上的 Firefox 和 Safari 中测试，用户无法保存图像。

标签： htmlcss