CSS の疑似クラスと疑似要素: 後

この記事では、CSS の :after 疑似クラスと疑似要素を主に紹介します。必要な友達はそれを参照できるように共有します。CSS にはいくつかの特別な属性があります。これらは疑似クラスと呼ばれ、リンク、:visited、:hover、:active などの疑似リンクです。興味のある方は、この記事で after の使い方を詳しく紹介します。役に立つかもしれません

CSS には疑似クラスと呼ばれるいくつかの特別な属性があり、その中で最もよく使用されるのは pseudo-:link、:visited、:hover、:active などです。リンクを定義します。 これらに加えて、:focus、:first-child、:lang など、一般的には使用されない疑似クラスもいくつかあります。

この記事の他の疑似要素は当面リストされません。疑似要素以降についてだけ説明します。
After は、その名前が示すように、要素の後にという意味で、要素の後にコンテンツを追加することです。
この疑似要素を使用すると、プロデューサーは要素コンテンツの最後に生成されたコンテンツを挿入でき、オブジェクトの後に発生するコンテンツを設定するには、 content 属性とともに使用する必要があります。デフォルトでは、この疑似要素はインラインですが、表示属性を使用して変更できます。
すべての主要なブラウザは :after 疑似要素をサポートしていますが、IE の場合は IE8 以降でのみサポートされています。


以下はCSSコードに
を挿入する例です:

コードは次のとおりです:

<style type="text/css"> 
h1:after {content:url(logo.gif)} 
</style> <h1>标题内容</h1>

1: String
例:

コードは次のとおりです:

<style type="text/css"> 
.test:after{content:"测试代码"}; 
</style> 
<p class="test">测试p：</p>
运行结果显示为：
测试p：测试代码

コードは次のとおりです:

<style type="text/css"> 
.test:after{content:attr(id)}; 
</style> 
<p class="test" id="aaa">测试p的id为：</p>运行结果显示为：测试p的id为：aaa