所有圖像一起移動，如果我改變個人的左邊緣

Question

我想爲此目的製作三個圖像的滑塊我在一個div中製作ul li並嘗試通過更改控制檯中留下的邊距來移動單獨的li，但它會移動所有圖像一起。請糾正我錯在哪裏。請參見下面的代碼

#slider{ 
 
    width: 311px; 
 
    height: 333px; 
 
    overflow:hidden;  
 
    } 
 

 
    #slider .slides{ 
 
    display: block; 
 
    width: 311px; 
 
    height:333px; 
 
    margin: 0; 
 
    padding: 0; 
 
    } 
 

 
    #slider . slide{ 
 
    position:absolute; 
 
    float:left; 
 
    list-style-type: none; 
 
    width:311px; 
 
    height:333px;  
 
    }

<div id='slider'>    
 
      <ul class='slides'> 
 
       <li class='slide'><img src='images/a.jpe'></li> 
 
       <li class='slide'><img src='images/b.jpe'></li> 
 
       <li class='slide'><img src='images/c.jpe'></li>     
 
      </ul>       
 
</div> 
 

 

Answer 1

這爲我工作：

li.slide:nth-of-type(2) { 
    margin-left: 20px; 
} 

這只是移動第二li元素。