CSS3 뷰포트 구문 분석 오류

브라켓을 다른 위치로 변경해 보았습니다. CSS3의 다음 코드는 W3C CSS Validator에서 허용하지 않습니다. 누군가 다음 코드에서 파싱 오류가있는 부분을 식별하도록 도와 주시겠습니까?CSS3 뷰포트 구문 분석 오류

감사합니다. 당신은 중첩 할 수 없습니다

@media (min-width: 300px) { 
    @viewport { 
     width: 300px; 
    } 
}

출처

2017-10-17 Linda Littleton Gray

media query 내부 @viewport at-rule. 미디어 쿼리는 특정 너비에서 페이지의 요소 모양을 제어하며 은 <meta name="viewport">의 대체 경로입니다. @viewport은 CSS의 기본 수준에서 미디어 쿼리 외부에 있어야합니다.

는 @viewport는 그런 말로 미루어 만 관련 인터넷 익스플로러 (Internet Explorer)를 다루는 그것을 만들 것 얼마나 큰 차이 고려 윈도우 8 또는 Windows 10에 '모드를 스냅'할 때, 당신은 꽤 많이 안전하게 당신이있어 완전히하지 않는 무시할 수 매우 특정 브라우저 및 운영 체제에 맞게 최적화 된 레이블 컨트롤.

<meta name="viewport" content="width=device-width, initial-scale=1">의 META 뷰포트를 설정하면 모바일 장치의 다양한 브라우저를 처리 할 수 있습니다.

단순히 페이지의 요소를 조정하려고한다고 가정하면 여러 브라우저를 처리 할 때 불일치로 직접 타겟팅 할 수 있습니다. 당신은 단순히 서로 다른 폭의 페이지 스타일을 정기적으로 미디어 쿼리에 의존 할 수

@media screen and (min-width: 300px) { 
    #id { 
    width: 300px; 
    } 
}

희망이 도움이! :)

출처

2017-10-17 01:16:07

같이해야 모든 브라우저 뒤로 여러 버전, 모든 화면 (RWD)을 위해 필요합니다. 이 코드 조각은 CSS3의 첫 번째 코드 줄이되어 HTML5 페이지에 배치되지 않습니다. 내 HTML5 소스 코드에서 이미 제안한 메타 태그가 있습니다. –

그럼 괜찮을거야. 솔직히'@viewport '를 사용하는 것에 대해 걱정하지 않겠습니다. 분명히'@ media' 쿼리를 사용하고 싶을 것이다. 먼저 표준 미디어 쿼리 (HTML''태그 포함)를 사용하여 사이트를 구축 한 다음 Windows에서 IE에 표시되는 방식을 확인하는 것이 좋습니다. 사이트가 잘 표시되면 (99 % 확률), 다른 작업을 수행 할 필요가 없습니다. –

HTML의 머리 부분에 메타를 추가하십시오.

<meta name="viewport" content="width=device-width, initial-scale=1.0">

그리고 당신의 CSS 내가 전체 스택 웹 개발자 및 할당에 대한 nanodegree을하고있는 중이 야이

@media only screen and (max-width : 500px) { 
    div { 
    width: 300px; 
    } 
}

출처

2017-10-18 05:44:26

CSS3 뷰포트 구문 분석 오류

답변

관련 문제