CSS データ属性は疑似要素を含む改行文字をレンダリングできますか?

CSS データ属性、改行文字、および擬似要素のコンテンツ値

CSS データ属性内に改行文字を組み込んで、擬似要素を使用して表示できるようにすることはできますか?このシナリオを詳しく見てみましょう。

次の CSS および HTML コードを考えてみましょう:

このシナリオでは、CSS では改行文字であると想定される「a」文字は、望ましいものを生み出すことができないresult.

解決策:

目的の動作を実現するには、データ属性を次のように変更します:

説明:

• "white-space: pre;" によって実現される、疑似要素への空白プロパティの追加。スタイルは、データ属性内の空白を保持します。
• 「display: inline-block;」 style を使用すると、疑似要素を複数行にまたがることができます。
• その結果、改行文字を含むデータ属性の内容は期待どおりにレンダリングされます。

以上がCSS データ属性は疑似要素を含む改行文字をレンダリングできますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。