その後のCSSは何ですか

藏色散人
藏色散人オリジナル
2020-12-03 10:57:0810206ブラウズ

css after は、選択した要素のコンテンツの後にコンテンツを挿入するために使用できる CSS のセレクターです。その構文は "p:after{ content:"";background-color: yellow ;color などです。 :赤;}"。

その後のCSSは何ですか

#この記事の動作環境: Windows 7 システム、Dell G3 コンピューター、css3 バージョン。

推奨: "

css ビデオ チュートリアル "

CSS では、:after 疑似クラスの機能は、要素の内容を指定することです (要素の内容ではありません)。要素自体) 次に、content 属性で指定されたコンテンツを含むインライン要素を挿入します。

最も基本的な使用法は次のとおりです:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<style>
p:after {
content: "- 台词";
}
</style>
</head>
<body>
<p>我是唐老鸭。</p>
<p>我住在 Duckburg。</p>
</body>
</html>

レンダリング:

その後のCSSは何ですか

疑似クラス後のいくつかのアプリケーション

: afterClear float

フローティング レイアウトによって高さが崩れ、レイアウト全体に影響を与える場合、要素はフロートをクリアする必要があります。使用方法: after はメソッドの 1 つです:

.row:after {
width:0;
height:0;
content:&#39;&#39;;
display: block;
clear: both;
}

疑似クラスと疑似要素

疑似クラス選択要素は、要素の ID、クラス、そして属性。状態は動的に変化するため、要素が特定の状態に達すると疑似クラス スタイルを取得する場合がありますが、状態が変化するとこのスタイルは失われます。このことから、その機能はクラスの機能に似ていることがわかりますが、ドキュメントの外部での抽象化に基づいているため、疑似クラスと呼ばれます。

擬似要素は、特殊な状態の要素を対象とする擬似クラスとは異なり、要素内の特定の内容に対して動作し、動作するレベルが擬似クラスよりも深いため、その動態は擬似クラスとなります。ははるかに低いです。実際、疑似要素を設計する目的は、要素内容の最初の文字 (文字) と最初の行を選択し、特定の内容の前後を選択することですが、これは通常のセレクターでは実行できないことです。制御する内容は実際には要素と同じですが、要素に基づいて抽象化されただけであり、文書内には存在しないため、疑似要素と呼ばれます。

以上がその後のCSSは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事:CSS3の新機能次の記事:CSS3の新機能