로컬 파일의 원격 CSS가 작동하지 않습니까?

Question

전 CSS에 대한 멍청한 반응이 있어요.

저는 로컬 및 원격으로 CSS 파일을 가지고 있습니다. 주소 표시 줄에 로컬 html 파일 (즉, c : \ temp \ index.html)을로드합니다. 나는 파이어 폭스를 사용한다. (: 100 % 높이)

내가 로컬 CSS 파일에 연결할 때, 모든 작품을 좋아

파일은 'HTML', '몸'과 ​​100 %이 개 된 div의 높이를 설정합니다. 원격 파일에 링크 할 때 높이 스타일 (적어도)이 작동하지 않는 것처럼 보입니다. javascript에서 본문 요소의 offsetHeight 속성을 가져 오려고 할 때 이것을 봅니다.

왜 이런 이유가있을 수 있습니까?

나는 사용하여 원격 사이트에 링크 : 클론 https://github.com/SirPepe/Pik5, 로컬 index.html 파일을로드 : <link rel="stylesheet" media="screen, projection" href="https://raw.github.com/SirPepe/Pik5/master/assets/css/pik5.css">

시험 법에

이 (로컬 파일의 DOCTYPE은 HTML입니다). <link rel="stylesheet" media="screen, projection" href="assets/css/pik5.css">이 <link rel="stylesheet" media="screen, projection" href="https://raw.github.com/SirPepe/Pik5/master/assets/css/pik5.css">이되도록 변경하십시오. 슬라이드가 더 이상 제대로 설정되어 볼을 다시로드

참고 : 나는

Answer 1

그래서 CSS 파일로드를 참조 불을 지르고를 사용하여, 뒷조사를하기 후에, 당신의 CSS 파일을 되는 것은에을 연결되어있는 것처럼 보이지만, 어떤 스타일도 실제로 적용되지 않습니다. 그로 인해 다른 일이 일어나고 있다고 믿게되었습니다. 나는 유효성 검사기를 통해 HTML을 실행하고 특정 아무것도 발견하지만, 검증을 통해 github의의 CSS를 실행할 때, 나는이 응답 가지고 :

I/O 오류 : 알 수없는 MIME 형식 : 텍스트/일반

그것을 github이 스타일 시트 파일에 text/css 대신 text/plain이라는 Content-Type HTTP 헤더를 보내는 것처럼 보입니다. 해당 스타일 시트 링크에 ​​대한 html 문서에 type="text/css을 간단하게 정의 할 수는 있지만 그렇지 않은 경우 mime 유형 설정에 액세스 할 수 없기 때문에이 문제를 해결할 수있는 방법이 확실하지 않습니다. Add mime type to HTML link

Answer 2

데이브의 게시물 실제로 문제를 설명 :

여기에 유사한 문제를 참조하십시오. 여기에 해결책이 있습니다. http://raw.github.com 대신 http://rawgithub.com을 사용해야합니다. 그래, 맞아. 방금 .!

문제는 Github이 올바른 MIME 형식의 "원시"파일을 제공하지 않기 때문에 핫 링크 할 수 있다는 것입니다. 이 문제를 해결하기 위해 rawgithub.com 사이트를 만든 Ryan Grove를 입력하십시오. 파일을 요청하는 서버를 공격하면 Github의 서버에서 해당 파일을 가져 와서 MIME 유형을 수정합니다.

경고 : 프로덕션 용도로 사용하지 마십시오. 데모 및 개발에만 사용하십시오.