background-blend-mode

1熱度

3回答

我注意到，使用mix-blend-mode時，即使使用相同的混合模式，結果也不同於使用background-blend-mode。例如，比較2周的結果如下：我抄在我的設置及以下JSFiddles： HTML <div class="background"> <div class="overlay"></div> </div> CSS .background{ widt

4熱度

3回答

混合混合模式被破壞的3D轉換

我正在擺弄mix-blend-mode屬性。一切工作正常，直到我在網頁上的任何位置添加諸如transform: perspective(100px)或任何其他3d轉換之類的東西，然後完全打破。應用了轉換，但混合模式消失了。我在chrome和firefox以及linux和windows上測試過，它在任何地方都是一樣的，但是在不同的計算機上它工作正常（我不記得它有什麼版本的chrome並且正在運行ub

1熱度

1回答

Chrome中的混合模式沒有正確應用

正在努力朝着聚焦的重複背景，並決定使用混合模式來實現這一點。但是，看起來好像混合模式不適用於Chrome。這裏複製：http://jsfiddle.net/pptn4f5v/7/ body { background: url("https://dl.dropboxusercontent.com/u/10686242/testfreeimage.jpg"), url("https://

0熱度

1回答

在透明圖像上應用混合模式

使用CSS，我試圖將背景圖像與顏色混合。儘管圖像是一個半透明部分的PNG。如何將混合模式應用於實際可見的部分，所以如果PNG有一個洞，那麼躺在後面的元素可以在那裏看到通暢？代碼等： background-image: url("Scales/Scale1.png"); background-color: rgba(0, 0, 255, 1); background-blend-mode:

-1熱度

1回答

只輸入單詞「體」有背景混合模式工作的HTML

我創建僅使用HTML和CSS網站一個怪異的行爲，我想在超大屏幕應用黑色半透明色調[我用自舉。 .jumbotron { height: 40rem; text-align: center; z-index: 2; background-size: cover; background-attachment:fixed; backgrou

3熱度

1回答

爲什麼CSS混合模式在針對文檔主體應用時不起作用？

下面是對指定的「背景」元工作CSS混合模式的例子： body { position: relative; } .background { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background: line

0熱度

1回答

具有不透明度和轉換的動畫混合模式

我正在尋找一種方法來更改background-color-blend-mode的不透明度，如 Photoshop。我的目標是動畫混合模式的不透明度，以使其消失。有任何想法嗎？ #img-esadvalence { background-image: url(http://leodurand.fr/works/planesad/esad1.jpg); backgroun

0熱度

3回答

是否可以將css混合模式應用於不同div中的元素？

是否可以將css混合模式應用於不同div中的元素？例如，我有一個div的大背景英雄圖像。在圖片上方（不同的div），我有一個藍色的半透明盒子，裏面有文字。這個透明的盒子是我想應用混合，但它似乎無法正常工作，也許是因爲他們不在同一個div中，就像https://css-tricks.com/basics-css-blend-modes/ 我在wordpress中工作，所以它會是一個有點難以重新構造

0熱度

1回答

線性漸變不能在邊緣和IE11中工作

我的CSS未顯示Microsoft Edge和IE11中的背景圖像。這似乎與這些瀏覽器中的線性漸變有關。背景顏色顯示出來，但不是Edge和IE11中的圖像。有什麼建議麼？ #DIV_1 { background-blend-mode: overlay, overlay; background-position: 50% 50%, 50% 50%; bottom: 0

0熱度

1回答

多種混合模式的應用順序是什麼？

我有以下的CSS代碼： div { background: url('image-url'), linear-gradient(gradient), url('image-url-2'); background-blend-mode: blend-mode-1, blend-mode-2; } 梯度或URL背景的位置可改變。我認爲這對混合順序應該有任何影響。我的問題是如何