2011-11-02 2 views
3

많은 코더는 스프라이트를 채택하지만 스프라이트에는 고정 된 컨테이너가 더 적어야한다는 사실을 잊어 버리는 것처럼 보입니다. 높이를 제어 할 수 없다면 h2에서 srite를 사용할 수 없습니다. H2가 텍스트 행이 1 개일 때 잘 보이지만, 3 행이있을 때 지옥이 풀리면 스프라이트의 다음 이미지가 표시됩니다.스프라이트 및 긴 텍스트

해결 방법은 무엇입니까? 그것의 컨테이너 안에 아이콘?

<h2> 
    <span class="ico">Text that needs to be hidden</span> 
    Lorem ipsum<br />dolor sit<br />amet 
</h2> 

또 다른 해결책은 이미지를 대각선으로 스프라이트 파일에 배치하는 것이지만이 솔루션은 100 % 0 위치 지정을 허용하지 않습니다.

당신의 솔루션은 무엇입니까? 폭이나 높이가 모두 가변 경우

+1

나는 대답은 가변 폭 또는 높이가 요소 스프라이트를 사용하지 않는 가정하자. 스프라이트에 _every_ 이미지가있을 필요는 없습니다. – MrMisterMan

답변

6

참고

아래 이미지의 적색 부분의 위치는, 어느 곳에서나 스프라이트 화상 를 배치했다. No repeated section; place image anywhere in sprite


높이가 변수이지만 폭이 고정되어있는 경우

, 당신은 스프라이트의 왼쪽 또는 오른쪽 가장자리를 따라 배경을 배치 시도 할 수 있습니다. 이렇게하면 반복 할 수 있습니다. Position repeated section on right of sprite


폭이 변수이지만 높이가 고정되어있는 경우

Position repeated section on left of sprite

, 당신은 스프라이트의 위쪽 또는 아래쪽 가장자리를 따라 배경을 배치 시도 할 수 있습니다. 이렇게하면 repeat-x를 사용할 수 있습니다.

Position repeated section on bottom of sprite


Position repeated section on top of sprite

폭과 높이가 모두 변수가 있다면, 난 당신이 효과적으로 스프라이트에 이미지를 사용할 수 있다고 생각하지 않습니다. 표준 배경 이미지 만 사용해야합니다.

Regular background image; no sprite