Question

我不知道为什么img标记内的picture不想显示？有任何想法吗？

谢谢！

<picture data-qa-node="picture" data-qa-file="AppBlocksCarousel">
        <source srcset="http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.webp 1x, http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.webp 2x, http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.webp 3x" type="image/webp" data-qa-node="source"
        data-qa-file="AppBlocksCarousel">
            <img src="http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png" srcset="http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png 2x, http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png 3x" alt="Google"
            class="AppBlocksCarousel__image_2gZ2B" data-qa-node="img" data-qa-file="AppBlocksCarousel">
    </picture>

Answer 1

您的图像路径错误。看看我的例子

<picture data-qa-node="picture" data-qa-file="AppBlocksCarousel">
        <source srcset="https://www.google.co.in/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" type="image/webp" data-qa-node="source"
        data-qa-file="AppBlocksCarousel">
            <img src="http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png" srcset="http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png 2x, http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png 3x" alt="Google"
            class="AppBlocksCarousel__image_2gZ2B" data-qa-node="img" data-qa-file="AppBlocksCarousel">
    </picture>

Answer 2

我相信这是图片：（source标签中的网址错误）

<picture data-qa-node="picture" data-qa-file="AppBlocksCarousel">
        <source srcset="http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png" type="image/webp" data-qa-node="source"
        data-qa-file="AppBlocksCarousel">
            <img src="http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png" srcset="http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png" alt="Google"
            class="AppBlocksCarousel__image_2gZ2B" data-qa-node="img" data-qa-file="AppBlocksCarousel">
    </picture>

Answer 3

您要查找的图像在此URL上不可用

http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png

尝试一下

<picture data-qa-node="picture" data-qa-file="AppBlocksCarousel">
            <source srcset="https://www.google.co.in/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" type="image/webp">
                <img src="http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png" srcset="http://diylogodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png, http://diy logodesigns.com/blog/wp-content/uploads/2016/04/google-logo-icon-PNG-Transparent-Background.png" alt="Google">
        </picture>

<picture>标签不显示图片

3 个答案: