Html 交替div具有左（偶数）或右（奇数）图像

我试图有一个更好的安排图像，而不是仅仅在一列图像。 请参阅附件中的示例，每篇文章的图像可以在左侧和右侧

这是我的密码。 HTML:

我该怎么做？请帮忙。 -提前感谢

尝试使用此css

.list_page article:nth-child(odd) .list_img{ 
    float:right; 
}
.list_page article:nth-child(even) .list_img{
     float:left;
}

---

问题是您选择的是父div而不是子文章

如果您选择文章，代码将起作用

<style>

article:nth-child(odd) .list_img{ 
    float:right; 
}
article:nth-child(even) .list_img{
     float:left;
}
</style>

第条：第N名儿童（单数）。名单{
浮动：对；
}
文章：第n个孩子（偶数）。列表{
浮动：左；
}

您好，您对奇数和偶数使用了错误的选择器。没有“.list_page”但有“article”标签

---

使用css属性显示：内联块；或显示：内联；

：nth-child（）

不应该应用于

文章而不是
。list\u page
？@BillyNate是：\，我应该删除这个问题吗？不要使用
内联块
或
内联块
，这是BS，你的div是
块
，将
浮点
应用于
块
是非常好的@只需接受一个答案。它们几乎都是一样的，选择你最合适的；）我认为塔拉卡的解释是最完整的。
.list_page article:nth-child(odd) .list_img{ 
    float:right; 
}
.list_page article:nth-child(even) .list_img{
     float:left;
}

<style>

article:nth-child(odd) .list_img{ 
    float:right; 
}
article:nth-child(even) .list_img{
     float:left;
}
</style>

article:nth-child(odd) .list_img{ 
    float:right; 
}
article:nth-child(even) .list_img{
     float:left;
}