24030 次
3 に答える
103
:before
and:after
は(または ortext-area
などの別の要素を含むことができない要素) では機能しません。これは、疑似要素の生成されたコンテンツが要素内に配置されますが、その要素のコンテンツの前または後に配置され、それ自体が要素として機能するためです。 . 疑似要素は、親要素自体の前後には配置されません (インターネットで見つけられる情報とは異なります)。説明する:img
input
このCSSがある場合:
p:before {content: 'before--'}
p:after {content: '--after'}
次に、次のようなhtml:
<p>Original Content</p>
ソース コードが次のように効果的に画面にレンダリングされます。
<p>before--Original Content--after</p>
ソースコードが次のようなものではない:
before--<p>Original Content</p>--after
そのため、コンテンツを生成するための「場所」がないため、(上記のような) html要素「コンテンツ」を含むことができないタグは疑似要素を認識しません。にはtextarea
「コンテンツ」を含めることができますが、純粋なテキスト コンテンツのみを含めることができます。
于 2010-07-20T18:45:22.980 に答える
-8
:after
実際には、入力要素にコンテンツを追加できます。これにより、要素がアクティブな状態にあるときに一種のヒントが追加されます。
#gallery_name {
position:relative;
}
#gallery_name:focus:after {
content: "Max Characters: 30";
color: #FFF;
position: absolute;
right: -150px;
top:0px;
}
<input id="gallery_name" type="text" name="gallery_name" placeholder="Gallery Name">
于 2012-06-02T19:35:12.773 に答える