その後のCSSは何ですか-CSSチュートリアル-php.cn

その後のCSSは何ですか

藏色散人

リリース： 2023-01-04 09:36:29

オリジナル

10196 人が閲覧しました

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 サイトの他の関連記事を参照してください。