자르기 이미지의 상단 높이 만 높이는 방법?

Question

이제 이미지의 최고 높이 만 늘리고 싶습니다. 그럴 수 있니? 또한 posiion absolute를 사용하지 않고 clip:rect()을 사용할 수 있습니까?

a.rollover img { 
    position : absolute; 
    clip:rect(16px,60px,200px,0px); 
    width: 64px; 
    height: 64px; 
} 

a.rollover:hover > img { 
    position : absolute; 
    clip:rect(6px,60px,200px,0px); 
    width: 64px; 
    height: 64px; 
} 

<a class="rollover"><img src="dest.jpg" /></a> 

Answer 1

는 아니, position: absolute를 사용하지 않고 clip: rect()을 사용할 수 없습니다. :hover 효과의 이미지 높이를보고 10px (16px 클립부터 6px 클립까지) 증가시켜야합니다.

그러나 하단의 200px은 클립의 오해를 나타내는 것으로 보입니다. 나는 내 이해에 매우 도움이 될 this article을 발견했습니다. clip. 기본적으로 왼쪽 위 모서리를 네 개의 숫자 중 첫 번째와 마지막으로 설정하고 오른쪽 하단 모서리를 으로 전체 요소의 왼쪽 상단 모서리에서 참조로 설정합니다. (margin, padding, 기타.).

  ^   ^
      | Top   | 
      v    | 
<--Left--->*    |Bottom 
          | 
          | 
          v 
<--------Right----------->*