欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

混合模式在手機(jī)瀏覽器中不起作用

CSS

screenshot of phone inspect mode.我在代碼中使用了mix-blend模式css屬性。 它可以在chrome桌面瀏覽器上運(yùn)行，但不能在我的手機(jī)chrome瀏覽器上運(yùn)行。 我用過(guò)mix-blend-mode:屏幕；div fire1、fire2、fire3圖像的屬性。 我做錯(cuò)了什么？請(qǐng)幫幫忙！ 謝謝大家！

我試過(guò)這個(gè):

body {
            background: url("https://i.postimg.cc/RF34x0dJ/Pngtree-red-glitter-pattern-indian-diwali-1447745.png");
            background-size: 100% 100%;
            background-repeat: no-repeat;
            background-attachment: fixed;
        }

        .fire1 img {
            position: absolute;
            mix-blend-mode: screen;
            top: 10px; 
            height: 200px;
            width: 200px;

        }
        .fire2 img {
            position: absolute;
            top: 10px;
            mix-blend-mode: screen;
            height: 200px;
            width: 200px;

        }
        .fire3 img {    
            position: absolute;
            top: 155px;
            mix-blend-mode: lighten;
            height: 368px;
            width: 368px;
        }

        

        .fire1 {
            display: flex;
            justify-content: right;

        }

        .fire2 {
            
            display: flex;
            justify-content: left;

        }

        .fire3 {
            display: flex;
            justify-content: center;

        }

<div class="fire1">
            <img src="https://ik.imagekit.io/souravkumar8409/bluefirework1.gif?ik-sdk-version=javascript-1.4.3&updatedAt=1672739568223"
                alt="fire">
        </div>

        <div class="fire2">
            <img src="https://ik.imagekit.io/souravkumar8409/bluefirework1.gif?ik-sdk-version=javascript-1.4.3&updatedAt=1672739568223"
                alt="fire">
        </div>

        <div class="fire3">
            <img style="mix-blend-mode: screen;" src="https://ik.imagekit.io/souravkumar8409/fireworkbig.gif?ik-sdk-version=javascript-1.4.3&updatedAt=1672739568765"
                alt="fire">
        </div>

我也遇到了同樣的問(wèn)題，似乎這個(gè)問(wèn)題與你想要使用混合混合模式的背景的主體元素有關(guān)。

我建議你試試這個(gè): 從正文中刪除所有背景元素 創(chuàng)建新的背景類:

.bg {
    position: fixed;
    /*define the size and position you need*/
    width: 100vw;
    height: 100vh;
    background: url("https://i.postimg.cc/RF34x0dJ/Pngtree-red-glitter-pattern-indian-diwali-1447745.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    z-index: -1;
}

<body>
    <div class="bg"></div>
    <div class="fire1">
        <img src="yourImage.jpg" />
    </div>

    <!-- OR -->

    <div class="bg">
        <div class="fire1">
            <img src="yourImage.jpg" />
        </div>
    </div>
</body>

如果需要，您可以放置。里面也著火了。bg:我測(cè)試了兩種方式，兩種方式都有效。

確保你在手機(jī)上使用的是兼容性瀏覽器

https://caniuse.com/?搜索=混合模式

Safari中的部分是指不支持色調(diào)、飽和度、顏色和亮度混合模式。