CSS Sprite 기술을 사용하여 몇 개의 축소판을 단일 이미지로로드하고 싶습니다 . 따라서 서버에서 오프라인으로 단일 파일의 축소판 몇 개를 "병합"해야합니다.
같은 크기의 축소판이 10 개 있다고 가정합니다. Linux 명령 줄에서 "병합"하는 방법은 무엇입니까?
CSS Sprite 기술을 사용하여 몇 개의 축소판을 단일 이미지로로드하고 싶습니다 . 따라서 서버에서 오프라인으로 단일 파일의 축소판 몇 개를 "병합"해야합니다.
같은 크기의 축소판이 10 개 있다고 가정합니다. Linux 명령 줄에서 "병합"하는 방법은 무엇입니까?
답변:
CSS 스프라이트를 만드는 데 좋은 ImageMagic 을 사용해 볼 수도 있습니다 . 여기 에 대한 몇 가지 자습서 .
예 (수직 스프라이트) :
convert image1.png image2.png image3.png -append result/result-sprite.png
예 (수평 스프라이트) :
convert image1.png image2.png image3.png +append result/result-sprite.png
convert -append *.png out.png
ImageMagick의 더 가볍고 빠른 포크 인 GraphicsMagick 을 사용할 수도 있습니다 .
gm convert image1.png image2.png -append combined.png
12 개의 이미지 병합에 대한 간단한 시간 비교 :
time convert image{1..12}.jpg -append test.jpg
real 0m3.178s
user 0m3.850s
sys 0m0.376s
time gm convert image{1..12}.jpg -append test.jpg
real 0m1.912s
user 0m2.198s
sys 0m0.766s
GraphicsMagick은 ImageMagick보다 거의 두 배 빠릅니다.
+append
대신 수평 스프라이트 사용을 위해 수직 스프라이트를 생성합니다-append
.