2012-07-23 6 views
1

background-size 속성에 $image-width$image-height 인수를 사용하는 데 문제가 있습니다. CSS는 (아래의 코드 예에서 주석 처리 된 행에 표시된대로) 인수를 작성하기로 선택한 경우에만 작동합니다. 동적 버전이 작동하지 않습니다. 내가 뭘 잘못하고있어?이 경우 Sass/SCSS mixin 인수를 올바르게 사용하는 것은 무엇입니까?

게다가이 코드 스 니펫은 장치에서 필요할 때만 망막 버전을로드해야합니다. 더 여기에 읽기 : Media Query Asset Downloading

/* see: http://timkadlec.com/2012/04/media-query-asset-downloading-results/ */ 
@mixin retina-background($filename, $image-width, $image-height, $extension: ".png") { 
    background-image: image-url($filename + $extension); 
    height: $image-height; 
    width: $image-width; 
    @media only screen and (-webkit-min-device-pixel-ratio: 1.5), 
    only screen and (min--moz-device-pixel-ratio: 1.5), 
    only screen and (-o-min-device-pixel-ratio: 3/2), 
    only screen and (min-device-pixel-ratio: 1.5) { 
     background-image: image-url($filename + "2x" + $extension); 
     //background-size: 213px 21px; 
     background-size: $image-width $image-height; 
     height: $image-height; 
     width: $image-width; 
    } 
} 
+0

코드를 확인한 결과 제대로 작동하며 'background-size'값이 있습니다. – Roman

답변

0

예, 코드가 잘 작동된다. 내 호출 함수의 인수에 "px"를 지정하는 것을 잊어 버렸습니다. 결과 CSS가 잘못되었습니다 (단위 없음). 무용 한 실수. 고마워요!

관련 문제