2010-05-06 3 views
4

현재 배경 이미지와 같은 경우 CSS 파일에 지정된 도메인이 없습니다. 이는 개발 및 생산 환경에서 모두 작동합니다.제작을 위해 CSS에서 이미지 도메인/경로를 변경 하시겠습니까?

성능상의 이유로 (쿠키없는 도메인)에 대한
background-image: url(/images/bg.png); 

, 우리는이 전환 싶습니다

background-image: url(http://staticimagedomain.com/images/bg.png); 

를 이상적으로, 우리가 그없는 하드 코딩을, 그래서 우리의 개발 환경은 여전히 ​​로컬 당길 수 .

가장 좋은 방법에 대한 의견이 있으십니까?

+0

이 정적 파일이거나 서버 측 스크립팅 언어 ASP 또는 PHP를 사용하여 생성 한 파일입니까? –

답변

6

이미지뿐만 아니라 쿠키없는 도메인에서도 CSS 파일을 호스팅하는 것이 좋습니다. 그런 다음 프로덕션 환경과 다른 환경에서 모두 작동하는 상대 경로를 사용할 수 있습니다.

당신이 쿠키없는 도메인으로 CSS 파일을 배포하는 경우 :

http://staticimagedomain.com/main.css 

는 그런 다음 두 환경에서 잘 작동합니다 상대 URL /images/bg.png을 남길 수 있습니다.

어쨌든 CSS 파일은 필요하지 않습니다.

+1

아, 그 이미지가 CSS 파일의 도메인에 관련된 것이지, 포함 된 페이지의 도메인이 아닙니다. . . – Neil

+0

네, 잘 작동합니다. 궁금한 점 : 내 대답을 뒷받침 할 몇 가지 예를 살펴보고 Stack Overflow, Amazon.com, Yahoo 및 You Tube의 CSS를 확인했습니다. 쿠키는 모두 쿠키없는 도메인을 사용합니다. 그들 모두는 쿠키없는 도메인에서 CSS 파일을 호스팅하지만 이미지를 참조하기 위해 전체 절대 URL을 사용합니다. –

+0

그러나 나는 또한 이것을 추가 소스로 발견했다 : http://stackoverflow.com/questions/2488369/serving-css-from-a-static-domain –

0

staticimagedomain.comlocalhost 또는 테스트 페이지가 제공되는 곳으로 리디렉션하도록 호스트 파일에 입력 하시겠습니까?

위대한 해결책은 아니지만 쉽고 빠릅니다.

+0

좋은 해결책, 그것은 역시 작동합니다! – Neil

0

다른 현명한 답변에 추가하기 : 때로는 시각적으로 인스턴스를 식별하고 혼란을 방지하는 데 도움이되는 약간의 차이 (예 : 일부 배경색)가있는 개발 용 다른 제작 용 스타일 시트 2 개를 갖는 것이 유용합니다. 프로덕션으로 갈 때 빌드 배포 스크립트 (Ant)를 사용하면 css 파일을 이동할 수 있습니다.

이 작업을 수행하는 경우 (또는이 작업을 수행하는 것이 좋을 것이라고 생각하는 경우) 질문에 간단한 대답이 있습니다.

관련 문제