如何为内部html使用奇数偶数伪类？

Question

我想使用下面的代码更改div.img-box的位置。我该怎么做？

<style>
  ul.home-grid-list li:nth-child (odd) div.img-box {float:left;}
  ul.home-grid-list li:nth-child (even) div.img-box {float:right;}
</style>

<ul class="home-grid-list">
            <li>
                <div class="img-box"><img src="images/h-grid-1.jpg"/></div>
                <div class="grid-info">                     
                    <p>This is Photoshop's version  of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin,</p>
                </div>
            </li>
            <li>
                <div class="img-box"><img src="images/h-grid-2.jpg"/></div>
                <div class="grid-info">
                    <p>This is Photoshop's version  of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin,</p>
                </div>
            </li>
</ul>

Answer 1

删除nth-child和括号之间的空格。

应该是：

ul.home-grid-list li:nth-child(odd) div.img-box {float:left;}
ul.home-grid-list li:nth-child(even) div.img-box {float:right;}

<强> Working DEMO here