I saw some examples in CSS in w3.org that uses what they called fictional tags. Please see example:
<P:first-letter>
</P:first-letter>
They look like asp.net’s tags. What are they exactly? Are these tags valid HTML? Are these tags valid XML? Can I use them? Can somebody illuminate me?
Looking at this article, I would say that these fictional tags are just tags that help you understand what a certain css property actually does.
For the given example, they are explaining how the p:first-letter{} affects the p element – it changes the style of the first letter in the element. You could interpret this as if the first letter of the p element had ‘invisible’/’virtual’/’fictional’ tags around it, which define a separate style for it – this is what they mean by fictional tags.
Bottom line, they are not valid tags, they are just a means to describe a concept in the tutorials.
As for the pseudo elements, this article explains it quite well.