css - CSS の最初の文字の選択の強調表示

Question

::first-letter疑似要素が適用されている要素の最初の文字を強調表示する方法はありますか?

テキストの選択に関して、ユーザーにフィードバックを提供しようとしています。選択したテキストは Twitter プラグインに使用されており、正常に動作します (つまり、最初の文字が含まれています)。ただし、テキストを実際に強調表示できるようには見えません。

ここにCodePen の例へのリンクがあります。ここに、私が話していることを示すのに役立つスクリーンショットがあります。

大きな赤い「S」を強調表示しようとしましたが、できませんでした。

これが重複している場合は、事前にお詫び申し上げます。ありがとう！

Answer 1

次のようなことができます。

p:first-letter {
  float: left;
  font-size: 3em;
  color: #333;
}

<p>This is your paragraph.</p>

これについては、数年前、Styling CSS First-Letterというタイトルの記事で書きました。そこにはさらに特殊なケースの例があります。