1. 引言
在网页开发中，CSS经常用来控制网页的样式。除了控制整体布局和颜色等样式属性，还可以精确地选择网页中的每一个元素，实现更为细节的样式控制。本文将着重讲解如何使用CSS从第5个点开始选择每个奇数元素，为大家提供一些实用的CSS技巧。
2. 用选择器选择奇数元素
在讲解如何从第5个点开始选择每个奇数元素之前，我们先来回顾一下CSS中如何选择奇数元素。
在CSS中，我们可以使用`:nth-child(odd)`伪类来选择所有奇数元素，如下所示：
li:nth-child(odd) {
background-color: eee;
}
这个样式将会将所有列表项中的奇数项背景设置为灰色。
3. 从第5个点开始选择每个奇数元素
现在，我们来看看如何实现从第5个点开始选择每个奇数元素。在简单场景下，我们可以使用`:nth-child()`伪类来实现，如下所示：
li:nth-child(n+5):nth-child(odd) {
background-color: eee;
}
这个样式将从第5个列表项开始，每隔一个选择一个，将其背景设为灰色。
现在，我们来分解一下这个选择器的含义：
- `:nth-child(n+5)`选择第5个及其之后的所有元素
- `:nth-child(odd)`选择奇数元素
这两个伪类放在一起使用，就能实现从第5个点开始选择每个奇数元素。
4. 进一步探索
我们在上面的例子中使用了`:nth-child()`伪类来实现选择器，但也可以使用其它伪类来达到相同的效果。比如，我们可以使用`:nth-of-type()`伪类来选择元素，如下所示：
li:nth-of-type(n+5):nth-of-type(odd) {
background-color: eee;
}
这个选择器和之前的是等价的，都能从第5个点开始选择每个奇数元素。
更进一步的，我们还可以使用`:not()`伪类来排除前4个点，如下所示：
li:not(:nth-of-type(-n+4)):nth-of-type(odd) {
background-color: eee;
}
这个选择器将排除前4个列表项，然后从第5个点开始每隔一个选择一个，将其背景设为灰色。
5. 总结
在本文中，我们讲解了如何使用CSS从第5个点开始选择每个奇数元素。我们使用了`:nth-child()`和`:nth-of-type()`伪类来实现，还介绍了如何使用`:not()`伪类来排除前面的元素。这些CSS技巧可以帮助我们实现更为细节的样式控制，为网页开发带来更多的灵活性。
参考文献：
- [CSS Tricks: :nth-child()](https://css-tricks.com/how-nth-child-works/)