僞元素中是否有僞元素？

div { position: relative; width: 100px; height: 100px; background: #f00; } 
div::before { position: absolute; content: ''; width: 75px; height: 75px; background: #0f0; } 
div::before::before { position: absolute; content: ''; width: 50px; height: 50px; background: #00f; }

是我的語法錯誤還是pseudo-element內的僞元素不被支持？僞元素中是否有僞元素？

請注意，我知道::after僞元素，但我需要另一個僞元素內的實際元素來實現，例如，其中::after不足以是：

div { position: relative; width: 100px; height: 100px; background: #f00; } 
div::before { position: absolute; content: ''; right: 0; bottom: 0; width: 75px; height: 75px; background: #0f0; } 
div::after { position: absolute; content: ''; left: 0; top: 0; width: 50px; height: 50px; background: #00f; }

由於::after是相對於元素和不::before。

來源

2013-07-25 Gajus

看到這個帖子http://stackoverflow.com/q/9007546/703717 – Danield

因爲你正在做的'absolute'定位，沒有理由不使用'：after'，它只需要將它的位置在某些方面計算到'：before'的位置（參見http://jsfiddle.net/dBj3c/4/，它將'：after'放在哪裏，如果它實際上可能是根據你的代碼在'before：before'之前）。 – ScottS

是我的語法錯誤還是pseudo-element內的僞元素不被支持？

如果我理解正確，那是不可能的。儘管它顯然可能在將來被允許，但您不能鏈接多個僞元素（從Selectors Level 3開始）。

每個選擇器只能出現一個僞元素，如果存在，它必須出現在代表選擇器主題的簡單選擇器序列之後。注：該規範的將來版本可能允許每個選擇器有多個僞元素。

有趣的是，你能鏈的::first-letter & ::before/::after僞元素與佔位符僞元件，例如

::-webkit-input-placeholder::first-letter { 
color: purple; 
}

http://jsfiddle.net/k3yb6/1/

來源

2013-07-25 20:59:39 Adrift

「一旦選擇器級別4被瀏覽器採用，它顯然會被允許」 - 選擇器級別4目前不允許多個僞元素：http://dev.w3.org/csswg/selectors4/#pseudo-元素。 –

@Paul D. Waite：確實如此，但考慮到它是一個WD，到CR或更遠的時候它可能會發生變化。謝謝你指出，雖然。 – Adrift

確實。我認爲這樣的行有時候被放在W3C規範中的推測性很強（即不是由於實現了他們描述的實際計劃），但是我沒有任何實際的知識。 –

僞元素中是否有僞元素？

回答

相關問題