CSS の
"::before" は「...の前」を意味します。疑似要素を作成し、選択した要素の最初の子要素として設定するために使用される疑似クラス要素です。、挿入されました。要素の他のコンテンツの前の構文は「element::before{スタイル コード}」です。
このチュートリアルの動作環境: Windows 10 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。
css における ::before の意味
css では、::before は、生成されたコンテンツ要素を表す疑似クラス要素です。は、対応する要素の抽象化可能なスタイルの最初の子要素、つまり、選択された要素の最初の子要素を表します。
挿入するコンテンツを要素の他のコンテンツの前に挿入するには::before を使用します。デフォルトではインラインで表示されます。 ::before では、コンテンツの値を指定するために content 属性が必要です。
<p class="test"> 2019/11/29 15:35:51 </p>//在这前面加一个小闹钟的图标就可使用::befor
.test::before { content: url(./1597910280\(1\).png); }
1. 疑似クラス オブジェクト。オブジェクトの前にコンテンツを設定するために使用されます。
##2.::before と :before 書き込みメソッドは同等です##相違点:
:before よりも互換性が高くなりますが、H5 開発では ::before の使用を推奨します
手順:1. 擬似クラス要素は content 属性と一緒に使用する必要があります
2. 擬似クラス要素は CSS レンダリング レイヤーによって追加されますjs を介して操作することはできません
3. 疑似クラス オブジェクトの特殊効果は通常、hover 疑似クラス スタイル
によって有効になります。これは少し役に立たないと思います。それかどうか。疑似要素と疑似クラスの違い
2) 構文の違い
: で始まる疑似要素をサポートしますが、
:: で始まる標準形式で記述することをお勧めします。
3) 疑似クラス/疑似要素の一覧
1 | :hover | |
1 | ##:link | 未訪問の要素を選択 |
:visited | 選択訪問済み要素 | |
:first-child | 親要素の最初の子要素である要素を選択します | |
:lang | 指定された lang 属性を持つ要素を選択します | |
:focus | キーボード入力フォーカスのある要素を選択します | |
:enable | 有効な各要素を選択します | |
#:disable | #無効化された各要素を選択##3 | |
:checked | 選択した各要素を選択します | 3 |
:target | 現在のアンカー ポイント要素を選択します | 3 |
##<疑似要素は次のとおりです> | ##: :first-letter |
1
指定された要素を選択します 要素の最初の行 | 1 | |
指定された要素のコンテンツの後にコンテンツを挿入します | 2 | |
#2 | ::selection | |
以上がCSS で ::before は何を意味しますかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。