2017-08-28 4 views
1

Ich habe versucht, Pseudo-Elemente mit Inhalt in das CSS für eine Seite, die mit der Fliegenden Untertasse-Bibliothek konvertiert wird, hinzuzufügen. Wenn ich die Seite in einem normalen Browser als HTML anschaue, funktioniert der Code einwandfrei und ich kann das Pseudo-Element (: before) sehen. Beim Rendern der PDF mit Fliegende Untertasse verschwindet jedoch das Pseudoelement.Unterstützt fliegende Untertasse Pseudo-Elemente

Gemäß der offiziellen Flying Saucer-Spezifikation wird CSS 2.1 unterstützt, sodass Pseudo- und Inhaltsattribute enthalten sein sollten. Warum funktioniert es nicht für mich? Alle anderen CSS funktionieren einwandfrei.

Antwort

1

Flying-Saucer unterstützt die folgenden CSS Pseudo-Elemente:

  • before
  • after
  • first-line
  • first-letter

Es unterstützt nur den Standard, Doppel-Doppelpunkt CSS3 Syntax (::after), und nicht die alte CSS2-Syntax mit einem Doppelpunkt (:after).

Hier ist ein funktionierendes Beispiel:

<html> 
<head> 
<style> 
    div::before {content: "before - "} 
    div::after {content: " - after"} 
    p::first-line {font-weight:bold} 
    p::first-letter {color:blue} 
</style> 
</head> 
<body> 
    <div>A div</div> 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sed scelerisque augue. Nulla eleifend aliquet tortor, vel placerat velit fringilla vitae. Sed quis sem eu arcu dapibus convallis.</p> 
</body> 
</html> 

Und das Ergebnis (mit fliegender Untertasse 9.1.6): PDF showing pseudo element applied

+0

Vielen Dank für Ihre Antwort. Weißt du, ob ich verwenden kann: First-of-Type oder ähnliche Selektoren? –

+0

Es macht nichts, scheint, dass dies Teil der CSS3-Spezifikation ist und nicht 2.1 –

+1

Nein, 'first-of-type' wird nicht unterstützt. Soweit ich das beurteilen kann, werden beim Quellcode der fliegenden Untertasse nur die 4 in der Antwort aufgelisteten Pseudoelemente unterstützt. – obourgain

Verwandte Themen