Lesson of nth-child

Lesson1

HTMLコード

<ul class="lesson">
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
        <li>7</li>
        <li>8</li>
        <li>9</li>
        <li>10</li>
</ul>

疑似クラスの設定

数値を入力して結果ボタンをクリックしてください。

li:nth-child()

Lesson2

HTMLコード

<div class="lesson">
        <p>1</p>
        <p>2</p>
        <div>3</div>
        <div>4</div>
        <div>5</div>
        <div>6</div>
        <div>7        
            <div>
                <div>8</div>
                <div>9</div>
                <div>10</div>
            </div>
        </div>
</div>

疑似クラスの設定

数値を入力して結果ボタンをクリックしてください。

div:nth-child()

1

2

3
4
5
6
7
8
9
10