2

複数の入力タイプのテキストがあり、上位3つだけを表示したい場合。私はこのhtmlとcssを使用しました。しかし、非表示は失敗します。

http://jsfiddle.net/naresh_kumar/qecCC/

HTML

<div id="urlLinksInput"> 
    <p> 
        <input id="inputurl0" name="inputurl[]" type="text" class="txtinput"> 
    </p>
    <p>
        <input id="inputurl1" name="inputurl[]" type="text" class="txtinput"> 
    </p>
    <p>
        <input id="inputurl2" name="inputurl[]" type="text" class="txtinput"> 
    </p>
    <p>
        <input id="inputurl3" name="inputurl[]" type="text" class="txtinput"> 
    </p>
    <p>
        <input id="inputurl4" name="inputurl[]" type="text" class="txtinput"> 
    </p>
</div>

CSS

 #urlLinksInput p input:nth-child(n+3) { display: none; }
4

2 に答える 2

3 
#urlLinksInput p:nth-child(n+3) input { 
   display: none; /* ^----this must be here,as <p> has only ONE child,
                                            and that is <input>*/
}

デモ

于 2013-02-26T08:20:29.847 に答える
2

HTML5hidden属性を使用します：

<input type="text" hidden>

...サポートされていないブラウザ用のこのフォールバックCSSを使用：

[hidden] {
    display: none;
}

デモ


編集

さらに良い使用input[type=hidden]。テキスト入力と同じように機能し、JavaScriptを介して操作できますが、非表示になっています。

<input type="hidden">
于 2013-02-26T08:21:16.187 に答える