之前实现无缝滚动大多结合js，如今有了css3，就简单多了。
HTML:

<div id="wrap">
    <ul id="list">
      <li>1</li>
      <li>2</li>
      <li>3</li>
      <li>4</li>
      <li>5</li>
      <li>1</li>
      <li>2</li>
      <li>3</li>
      <li>4</li>
      <li>5</li>
    </ul>
</div>

CSS:

*{
    margin: 0; 
    padding: 0;
}
#wrap{
    width: 500px;
    height: 100px; 
    border: 1px solid #000; 
    position: relative; 
    margin: 100px auto; 
    overflow: hidden;
}
#list{
    position: absolute;
    left: 0; 
    top: 0; 
    margin: 0; 
    padding: 0;    
    -webkit-animation: 3s move infinite linear; 
    width: 200%; 
}
#list li {
    list-style: none; 
    width: 98px; 
    height: 98px; 
    border: 1px solid #fff; 
    background: #000; 
    color: #fff; 
    font: 50px/98px Arial;
    text-align: center;
    float: left;
}
@-webkit-keyframes move{
    0% {
          left: 0;
    }
    100% {
          left: -500px;
    }
}
@keyframes move {
    0% {
       left: 0;
    }
    100% {
       left: -500px;
    }
}
#wrap:hover #list {
    -webkit-animation-play-state: paused; /*动画暂停播放*/
}

另外一个例子：

用CSS3实现无限循环的无缝滚动