2016-04-07 18 views
-4

私はHTML文書を持っていますが、これは変更できません。 反対側には、テキストを追加する必要がある.cssファイルがあります。私はコンテンツプロパティを使用しました。結果は、 "input type =" text "の前にテキスト" NAME "があり、" input type = "number"の前にテキスト "NUMBER"が必要です。Css - 間にテキストを追加

私はリンクの下でCSSコードで既に行った最初のものです。

<div> 
    <div> 
     <div class="spacer"></div> 
    </div> 
</div> 
<div> 
    <div> 
     <input type="text" /> 
    </div> 
    <div> 
     <input type="number" /> 
    </div> 
</div> 

私のhtmlコードはここにある:http://www.beetxt.com/MZ2/私はそれが何を示していないし、サイトにここに書くとき。

そして、私のCSSファイル:http://www.beetxt.com/Tdb/

しかし、私は、HTMLファイルを変更せずに「」の前にテキストを表示する方法を知りません。 .cssファイル、スタイルのみを使用できます。我々はnth-childステートメントを使用する必要があります、私たちににフックするいかなるクラスまたはIDを持っていないことを考えると

+0

可能な重複します。http:// stackoverflowの。 com/questions/4879719/insert-html-from-css) – derloopkat

答えて

2

:[CSSからHTMLの挿入](の

div:nth-child(2) div:first-child::before { 
 
    content: 'NAME'; 
 
    display: block; 
 
} 
 
div:nth-child(2) div:nth-child(2)::before { 
 
    content: 'NUMBER'; 
 
    display: block; 
 
} 
 
.spacer:after { 
 
    content: "SPACER"; 
 
}
<div> 
 
    <div> 
 
    <div class="spacer"></div> 
 
    </div> 
 
</div> 
 
<div> 
 
    <div> 
 
    <input type="text" /> 
 
    </div> 
 
    <div> 
 
    <input type="number" /> 
 
    </div> 
 
</div>

+0

これは私のためにうまくいきます。どうやって、 "name"と "number"という言葉が同じ行に表示されないのですか? – Jolek111

+0

私は本当に私の英語については残念です、それは私の第三言語です。 http://s9.postimg.org/s0nc6kp7j/pic1.png 私は自分のコードを使用すると、写真のバージョン1を取得しますが、画像上にバージョン2が必要です。写真は以下のリンクにあります:http://s9.postimg.org/s0nc6kp7j/pic1.png – Jolek111

関連する問題