미디어 쿼리가 올바른 CSS를로드하지 못했습니다.

방금 http://alistapart.com/article/responsive-web-design 문서를 읽고 몇 가지 아이디어를 테스트하려고합니다. 내 사이트를 탐색하는 장치의 크기에 따라 다른 CSS 파일을로드하고 싶습니다. 두 사람 사이 다르다미디어 쿼리가 올바른 CSS를로드하지 못했습니다.

.hero-unit { 
    background: url("../img/ipod5.jpg"); 
    height: 4em; 
    width: 15em;  
    padding: 0.5em; 
    margin-bottom: 2em; 
    background-color: #eeeeee; 
    -webkit-border-radius: 4px; 
    -moz-border-radius: 4px; 
      border-radius: 4px; 
}

유일한 :

나는 다음과 같은 코드가 있습니다, 나는 다음 클래스를 RH와 RH-모바일 CSS 파일을 모두 내부

<link href="<?php echo base_url()?>assets/css/bootstrap.css" rel="stylesheet"> 
    <link rel="stylesheet" type="text/css" media="screen and (max-device-width: 480px)" href="<?php echo base_url()?>assets/css/rh-mobile.css" /> 
    <link rel="stylesheet" type="text/css" media="screen and (max-device-width: 1280px)" href="<?php echo base_url()?>assets/css/rh.css" />

이 로드되고있는 이미지 모바일 CSS는 ipod5.jpg 파일을로드하고 데스크톱 버전은 다른 파일을로드합니다.

파이어 폭스에서 내 사이트를 테스트하는 동안 CSS가로드되고 있지 않은 것으로 나타났습니다. 로드되는 유일한 것은 bootstrap.css입니다.

어디에서 잘못 될지 알려주실 수 있습니까?

출처

2013-03-22 dot

화면 너비가 '480px' 이상이고'1280px '보다 큽니까? 만약 그렇다면, 당신이 "최대 - 장치 - 너비"를 초과하기 때문에 그것은로드되지 않을 것이다. – ScottS

브라우저에서 테스트 할 경우 max-device-width에서 max-width - working으로 변경하여'max-width'를 입력하십시오. –

. 차이점을 설명해 주시겠습니까? – dot

부트 스트랩을 사용하는 경우 반응 형 부트 스트랩을 사용하지 않는 이유는 무엇입니까? Btw 기본 URL은 다음과 같이 작성해야합니다. <?php echo base_url("assets/css/bootstrap.css")?>

출처

2013-03-22 22:39:44 hjuster

미디어 쿼리가 올바른 CSS를로드하지 못했습니다.

답변

관련 문제