Firefox 또는 IE에서 CSS가로드되지 않습니다.

내 웹 사이트가 해상도에 따라 CSS를 변경 한 후 CSS가 Firefox 및 IE에서로드를 중지했습니다. 그러나 캐시를 지우고 다시로드 한 후에도 여전히 크롬에서 작동하는 것으로 보입니다. 모든 브라우저에서 캐시를 지우고 여러 번 다시로드하려고 시도했습니다.Firefox 또는 IE에서 CSS가로드되지 않습니다.

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <link rel="stylesheet" type="text/css" media='screen and(min-width:721px)' href='css/master.css'/> 
    <link rel='stylesheet' type="text/css" media='screen and(max-width:720px)' href='css/mobile.css'/> 
    <script type="text/javascript" src="javascript/script.js"></script> 
<title>The Resistance</title> 
</head>

또한 여러 페이지 스타일 시트를 구현 한 후에 다른 페이지의 일부 jquery가 모든 브라우저에서 작동하지 않습니다. 문제를 해결하는 방법에 대한 조언이 있으십니까? 추가 정보를 드릴 수 있다면 계속해서 물어보십시오. 웹 사이트 링크는 -------------

는 W3C 유효성 검사기는 모든 http://webdesignerwall.com/tutorials/css3-media-queries에 따르면, XHTML 1.0 엄격한

출처

2013-04-23 user2309612

최소/최대 너비 요구 사항을 하나의 CSS 파일에 추가 할 수 있습니다. 즉, 브라우저에서 다운로드해야하며 모든 브라우저에서 작동 할 수 있습니다. – pickypg

CSS 파일을 레이아웃하는 가장 좋은 방법, IMHO, 그래서 같다 :

/* Theme style rules */ 
#wrapper { 
    background-color:#444; 
    color:white; 
    font-family:Verdana, Arial, Times; 
} 

/* Static structure rules */ 
#wrapper { 
    overflow:hidden; 
    width:50em; 
} 

/* Responsive structure rules */ 
@media screen and (max-width:1220px) and (min-width:1151px) { 
    #wrapper { 
     font-size:15px; 
    } 
} 
@media screen and (max-width:1150px) and (min-width:1081px) { 
    #wrapper { 
     font-size:14px; 
    } 
}

는 기본적으로 싶은 것은 섹션에 코드 밖으로 별도입니다. 테마 섹션은 DOM 요소의 흐름에 영향을 미치지 않는 사항만을 다루고 있습니다. 정적 구조 섹션은 화면 크기에 관계없이 변경되지 않는 규칙을 설정합니다. 반응 형 섹션은 미디어 쿼리를 입력하는 부분입니다. 미디어 쿼리에 대한 중단 점을 찾는 가장 좋은 방법은 "방법을 망칠 때까지 그것을 극복하십시오"입니다. 의미는 페이지가 쓰레기처럼 보일 때까지 브라우저를 닫은 다음 미디어 쿼리를 추가하고 페이지를 다시 정렬합니다.

이전의 IE는 미디어 쿼리를 지원하지 않으므로 IE의 조건부 주석을 사용하여 css3-mediaqueries.js.이라는 polyfill을 추가하려고합니다. 모든 브라우저에서 미디어 쿼리를 작동시키는 JS 파일 일뿐입니다.

편집 : 또한 link을 따르고 북마클릿을 사용하여 현재 화면 크기를 확인할 수 있습니다. 반응 형 디자인에 매우 유용합니다.

출처

2013-04-23 04:00:13

모든 도움에 감사드립니다. – user2309612

@ user2309612 환영합니다. 프로젝트에 행운을 빈다. –

에 괜찮다고 생각했다 추가

--Edited을 고마워요 여기 , 인라인 미디어 쿼리는 CSS3 기능입니다. 따라서 CSS3를 지원하지 않는 브라우저는 CSS3를 건너 뜁니다.

옵션은 다음과 같습니다

1)과 같이 하나 개의 파일에 모든 CSS 이동 :

@screen and(min-width:721px) { 
    #Your desktop CSS here 
} 

@screen and(max-width:720px) { 
    #Your mobile CSS here 
}

2) 폭 기준을 삭제하고 '화면'과 '핸드 헬드'대신의 사용에 의존 단순히 HTML의 전체 검색어 :

<link href="css/master.css" media="screen" type="text/css" rel="stylesheet" /> 
<link href="css/mobile.css" media="handheld" type="text/css" rel="stylesheet" />

희망이 있습니다.

출처

2013-04-23 03:43:00

도움을 많이 주셔서 감사합니다. 여기에서 얻을 수 있어야합니다. ^^ – user2309612

에 한번 당신의

<link rel="stylesheet" type="text/css" media='screen and(min-width:721px)' href='css/master.css'/>

에

<link rel="stylesheet" type="text/css" media="only screen and (min-width: 721px)" href="master.css" />

내가 모바일에서 문제를 시도하지 않았다 교체,하지만 시도 퍼팅 만도이 모바일에 문제가 .. 그리고

을 추가하는 경우

<!DOCTYPE html>

코드 시작 부분. 이 도움이 희망 ..

출처

2013-04-23 03:51:08 Keensleeeeeeee

Firefox 또는 IE에서 CSS가로드되지 않습니다.

답변

관련 문제