html - 元素的回退未触发

Question

我正在尝试使图片元素工作，但它不会加载后备 img

   <div class="card">
        <picture>
            <source type="image/png" srcset="https://company-dev.s3.amazonaws.com/carscan/https://lorempixel.com/250/250/transport/?66555">
            <img class="card-img-top scale-on-hover" alt="Fallback" src="http://carscan.test/storage/images/no_image_found.jpg">
        </picture>

        <div class="card-body">
            <h6><strong>Location</strong>: Door LB</h6>
            <p><strong>Type</strong>: Window Crack <br>
            <strong>Severity damage</strong>: Medium</p>
        </div>
    </div>

在我的浏览器中，我在源 (aws) 元素上得到 403，但随后我希望它转到后备图像。但相反，它向我显示了小 img 图标和我的替代文字
当我从元素中删除源项目时，我的 img 元素显示没有任何问题。我忘记了一个元素还是一个小角色？

Answer 1

试试这个作为替代

 <p>
    <object data="https://company-dev.s3.amazonaws.com/carscan/https://lorempixel.com/250/250/transport/?66555" type="image/png">
       <img src="https://cdn.sstatic.net/Img/unified/sprites.svg?v=e5e58ae7df45" alt="Stack Overflow logo and icons and such">
    </object>
 </p>