html - CSS クリップを使用した後、画像を移動して別のセクションを表示できますか?

Question

CSS の clip プロパティを使用して画像をクリップしました。画像を左上隅から表示します。画像の中心を表示するように画像を移動できますか? 次のスタイルプロパティを試して画像を移動しようとしましたが、上、左、およびマージンに失敗しました。インターネット全体を検索しましたが、見つけることができるのはクリップ プロパティの使用方法に関する説明だけです。これが私のコードです：

CSS

.clip {
    position: relative;
    height: 130px;
    width: 200px;
    border: solid 1px #ccc;
}
.clip img {
    position: absolute;
    clip: rect(10px 190px 120px 10px);
}

html

<ul id="galleries">
  <li class="clip">
    <a href="images/image_01.jpg" rel="lightbox">
      <img src="images/image_01.jpg"/>
    </a>
  </li>
  <li class="clip">
    <a href="images/image_02.jpg" rel="lightbox">
      <img src="images/image_02.jpg"/>
    </a>
  </li>
  <li class="clip">
    <a href="images/image_03.jpg" rel="lightbox">
      <img src="images/image_03.jpg"/>
    </a>
  </li>
</ul>