Web担当者Forumさんでは「疑似要素」は、HTML(実際にはDOMツリー)内に、通常のHTMLでは指定できない「抽象的な要素」を作りだすものです。さっきよりは少しわかるようなわからないような。Webparkさんの「なぜ擬似要素という名称なのか」と言う考察と合わせると自分の中で少し理解できたきがするのでWebparkを参考に個人的にメモを残します。擬似要素と擬似要素を使わずに同じような表示をした例。CodePen.::first-letter擬似要素を使わずに一文字目にスタイルを適用させたい場合、spanなど他の要素で囲むことでスタイルを囲む必要があります。擬似要素はその要素を擬似的に要素を生成しているということなのかと思いました。同様に::after擬似要素の例。::afterはclearfixで良く使用されるのでそちらを例にすると、擬似要素を使用しないで再現しようとするとspanなど他の要素を入れる必要があります。擬似要素は要素内の後ろに要素を擬似的に生成しているのかと思います。上部の例はわかりやすいように形を表示しています。擬似クラスは要素内全体に対してスタイルを適用する。CSS3までで勧告されているの擬似クラスは数が多いので少しだけあげると:nth-child():nth-of-type():link:hoverなどなど、他にも同じようなもの含め多数あります。擬似クラスの考察W3Cの日本語訳だと「擬似クラスは、文書ツリーの範囲外にある情報や、単体セレクタでは表現できないものを選択できるように導入された概念だ。「疑似クラス」は、HTML外の要因による状態や、一般的なシンプルなセレクタでは指定できないものを指します。