0

私は次のHTMLを持っています:

<ul class="articles">
    <li>
        <!-- Display these -->
        <ol class="faces">
            <li>
                <a href="#">View More #1</a>
            </li>
            <li>
                <a href="#">View More #2</a>
            </li>
        </ol>
    </li>
    <li>
        <!-- Hide these -->
        <ol class="faces">
            <li>
                <a href="#">View More #3</a>
            </li>
            <li>
                <a href="#">View More #4</a>
            </li>
        </ol>
    </li>
</ul>

ol.faces li'sページが最初にロードされたときに、最初のページ(#1 と #2 のアンカー リンクを含む) を表示し、後続のページを非表示にしたいと考えていますol li's。これ以上クラスを追加せずに css を使用することは可能ですか?

4

3 に答える 3

1

liの直系の子孫であるすべてのタグを非表示にします.article 

   .articles>li{
        display:none;
    }

li内の最初のものを表示.article

.articles>li:first-child{
    display: block;
}

作業例: http://jsfiddle.net/xNnpR/

于 2013-03-04T10:13:04.330 に答える
0 
.articles > li:first-child{
   visibility: visible !important;
}


.articles li{
   visibility: hidden;
}
于 2013-03-04T10:12:43.547 に答える
0

セレクターを使用できます：

li:first-child
{
    /* Your CSS  */
}

DOCTYPE を宣言して、IE8 および IE7 で機能するようにします。

http://www.w3schools.com/cssref/tryit.asp?filename=trycss_sel_firstchild_more3を参照してください。

于 2013-03-04T10:09:21.470 に答える