의사 요소에 의사 요소를 사용할 수없는 이유는 무엇입니까?

Question

우리는이 같은 의사 요소를 사용할 수 있습니다

div:before{ 
    content: "pseudo!"; 
    position: absolute; 
    right: 200px; 
} 

그러나 다시 의사 요소에 대해, 나는이 같은 첫 문자 장식하고 싶었 :

div:before:first-letter{ 
    font-size: 26px; 
    color: red; 
} 

을하지만 더 이상 어떤 작동하지 않습니다. 왜? doc에서

Answer 1

는 :

의사 요소는 문서 언어에 의해 지정된 것 이외의 문서 트리에 대한 추상화를 만들 수 있습니다. 예를 들어, 문서 언어는 요소의 내용의 첫 번째 문자 또는 첫 번째 행에 액세스하는 메커니즘을 제공하지 않습니다.

---

하지만 그렇게 정확히 필요한 경우, 별도로 다음과 같은 두 가지 의사 요소를 사용할 수 있습니다

div:before{ 
    content: "p"; 
    position: absolute; 
    right: 240px; 
    top: 0; 
    font-size: 26px; 
    color: red; 
} 
div:after{ 
    content: "seudo!"; 
    position: absolute; 
    right: 200px; 
} 

demo

Answer 2

the spec 만 선택 당 하나의 의사 요소 수 있기 때문에 :

를

셀렉터 당 단 하나의 의사 요소 만 나타날 수 있으며, 존재하는 경우 appe 여야합니다 셀렉터의 주제를 나타내는 단순 선택자 시퀀스 다음에 ar. 참고 :이 사양의 이후 버전에서는 선택기 당 여러 개의 의사 요소를 허용 할 수 있습니다.