Css Ul与li造型

我有'ul'和'li'结构元素，我需要将css应用于li，在每4个li元素之后，第5个li应该使用给定的css。

---

我已经给了每一个元素26像素的余量，但我想给第五个元素0像素的余量 以下是我的Html：

 <ul class="clearfix">       
          <li><a href="CSR_Js/CSR-PhotoGallery/images/photos/01-turntable-illustration-graphic.png"  title="Turntable by Jens Kappelmann">
              <img src="CSR_Js/CSR-PhotoGallery/images/photos/01-turntable-illustration-graphic-thumbnail.png" width="170" height="150" alt="turntable"></a></li>

          <li><a href="CSR_Js/CSR-PhotoGallery/images/photos/02-robot-diy-kit.png" title="DIY Robot by Jory Raphael">
              <img src="CSR_Js/CSR-PhotoGallery/images/photos/02-robot-diy-kit-thumbnail.png" width="170" height="150" alt="DIY Robot Kit"></a></li>

          <li><a href="CSR_Js/CSR-PhotoGallery/images/photos/03-todly-green-monster.png" title="Todly by Scott Wetterschneider">
              <img src="CSR_Js/CSR-PhotoGallery/images/photos/03-todly-green-monster-thumbnail.png" width="170" height="150" alt="Todly"></a></li>

          <li><a href="CSR_Js/CSR-PhotoGallery/images/photos/04-loz-tea-party.png" title="LoZ Tea Party by Joseph Le">
              <img src="CSR_Js/CSR-PhotoGallery/images/photos/04-loz-tea-party-thumbnail.png" width="170" height="150" alt="legend of zelda tea party"></a></li>

          <li><a href="CSR_Js/CSR-PhotoGallery/images/photos/05-klaxon-air-horn.png" title="Klaxon Icon by John Khester">
              <img src="CSR_Js/CSR-PhotoGallery/images/photos/05-klaxon-air-horn-thumbnail.png" width="170" height="150" alt="airhorn icon"></a></li>

          <li><a href="CSR_Js/CSR-PhotoGallery/images/photos/06-flat-coffee.png" title="Flat Coffee by Baglan Dosmagambetov">
              <img src="CSR_Js/CSR-PhotoGallery/images/photos/06-flat-coffee-thumbnail.png" width="170" height="150" alt="flat coffee"></a></li>

          <li><a href="CSR_Js/CSR-PhotoGallery/images/photos/07-ipad-music-player.png" title="iPad Music Player by Angel Bartolli">
              <img src="CSR_Js/CSR-PhotoGallery/images/photos/07-ipad-music-player-thumbnail.png" width="170" height="150" alt="player ui"></a></li>

          <li><a href="CSR_Js/CSR-PhotoGallery/images/photos/08-extreme-fish-bowl.png" title="Extreme Fish Bowl by Brian Franco">
              <img src="CSR_Js/CSR-PhotoGallery/images/photos/08-extreme-fish-bowl-thumbnail.png" width="170" height="150" alt="extreme skateboarding fish bowl"></a></li>

          <li><a href="CSR_Js/CSR-PhotoGallery/images/photos/09-city-building-illustration.png" title="Illustration by Brandon Ancone">
              <img src="CSR_Js/CSR-PhotoGallery/images/photos/09-city-building-illustration-thumbnail.png" width="170" height="150" alt="city illustration"></a></li>

          <li><a href="CSR_Js/CSR-PhotoGallery/images/photos/10-big-restaurant.png" title="Restaurant Illustration by Dury">
              <img src="CSR_Js/CSR-PhotoGallery/images/photos/10-big-restaurant-thumbnail.png" width="170" height="150" alt="restaurant illustration"></a></li>

      </ul>

使用：

您可以使用pseudo类n子类来实现此目的，请参阅

---

但这在较旧的浏览器中不受支持，因此可以使用库作为回退。也请阅读

Hi Naeem，它正在工作，谢谢你，Naeem，但我需要给它留出正确的边距：0px。请研究一些CSS选项@Mardzis:请帮忙，我已经给了每一个li以26px的保证金，但我想给第五元素以0px的保证金。我给了每一个li以26px的保证金，但我想给第五元素以0px的保证金。

#thumbnails ul li {
    float: left;
    margin-right: 26px;
    margin-bottom: 12px;
}

li:nth-child(5n){
  /*style here*/
}

li:nth-child(5n)
{

    color:red;
}