样式主页网格

Question

我在尝试设置我正在处理的主页时遇到了问题。这是我正在做的非常简单的版本。 http://cdpn.io/kgLzD
我正在使用wordpress并在div中输出the_loop，输出8个帖子，带有一个“post”类。我遇到的问题是如下图所示为每个帖子设置样式，因为它们是div并且无法控制选择哪个“post”来设置样式？如果我使用的是列表，那么我可以选择要设置样式的项目。任何有关实现以下样式的帮助/提示/建议将不胜感激。

这是我目前所处的位置，你可以看到我基本上需要的是边界。你会如何实现这一目标？

Answer 1

你可以使用css nth-of-type（）选择器 - 因为你向左浮动并且div为2-up，使用nth-of-type（2n）将选择右列中的所有div :(请参阅此处的codepen：http://cdpn.io/Iacvk）

section.home-grid {
   width:440px; 
}
.post {
  border-top:1px solid #777;
  width: 200px;
  float:left;
  padding: 10px;  
}
.post p {
  padding:.5em 1em;
  width:90%;
  margin:0 auto;
  text-align:justify;
}
.post:nth-of-type(2n) p {
  border-left:2px dotted #777;
}

Answer 2

不完全确定你在寻找什么，但也许在帖子上使用nth-child css选择器会有所帮助。

http://css-tricks.com/how-nth-child-works/