破解：修改：在之前內聯CSS

我有一個ASP.NET（剃刀）頁面中的「動態式」（不要問爲什麼，就是這樣）破解：修改：在之前內聯CSS

<div class="myClass" style="background-image: url('@myUrl');">

一切就像一個魅力。但它現在需要將URL放在「.myClass：before」（通過myClass:before{height:100px; position: absolute; background-image:url('@myUrl'); z-index:-1;}裁剪背景圖像高度）。

此修改只能在CSS中完成，但@myUrl是一個動態值...而且我們還沒有動態CSS ...應該如何做quickfix？

來源

2015-04-30 Serge

你不能，這主要是因爲：前元素不是操縱一個真正的元素？ – jbutler483

AFAIK沒什麼。 CSS無法檢測到內聯樣式，並將其擴展到樣式表中的某些內容。 –

我明白，但正在尋找黑客... – Serge

使用inherit關鍵字爲:before pseudoelement的background-image，所以它會自動繼承爲div定義的背景。

也設置一個background-size: 0 0到div所以圖像不會visibile兩次。

div { 
    background-size: 0 0; 
} 

div:before { 
    content: ""; 
    display: block; 
    background-image: inherit; 
    background-size: <your size here>; 
    position: absolute; 
    ... 
}

例子：http://codepen.io/anon/pen/PqbKde

來源

2015-04-30 15:26:15 fcalderan

謝謝。不過，我需要看到只有一個圖像（前一個），而不是兩個... – Serge

不起作用：http://codepen.io/anon/pen/aOByjd – Serge

@serge http://codepen.io/anon/筆/ PqbKde – fcalderan

破解：修改：在之前內聯CSS

回答

相關問題