HTML 페이지에서 CSS 파일을로드하는 순서를 알고 싶습니다.HTML 페이지에서 CSS 파일을로드하는 순서는 무엇입니까?
실제 요구 사항은 다음과 같습니다. 응용 프로그램에 10 개 이상의 CSS 파일이 있습니다.
각 HTML 페이지에서 3 ~ 4 개의 CSS 파일을 가져옵니다. 문제는 일부 CSS 파일에 정의 된 중복 클래스가 있다는 것입니다. 즉, CSS 파일의 CSS 클래스 중 일부를 무시합니다. 일부 페이지에서는 올바르게 작동합니다. 일부 페이지에서는 잘못 작동합니다. HTML 페이지의 일부 DIV에 대해서도 인라인 스타일을 정의했습니다. 나는 DIV에 대해서도 CSS 클래스를 유지하고있다.
누구에게 우선 순위가 더 높거나 어느 것이 먼저로드 될지 알 수 있습니까?
일반적으로 마지막 규칙이 우선합니다. 인라인 스타일이 외부 스타일 시트 (인라인! important는 외부보다 중요 함 등)보다 우선하며,보다 구체적인 선택자가 일반 선택자를 대체한다는 점에서 "예외"가 있습니다. http://www.w3.org/TR/CSS2/cascade.html
좋아요, 외부 파일 로딩은 어떻게 될까요? 그것은 CSS 파일, 이름 또는 다른 매개 변수의 크기에 따라 좌우됩니까? –
외부 파일은 DOM에 포함 된 순서대로로드되고 가져 오기 스타일 시트는 '가져 오기 도구'앞에로드됩니다. – p00ya
CSS 파일들이 페이지에 나타나는 순서대로로드 @
모두 그것에 대해 읽어보십시오. 클래스가 CSS 파일에서 재정의되면 이전 클래스 문을 대체합니다.
그래서div.sample { background: none; width: 200px }
div.sample { color: #FFF; width: 400px }
div.sample { background: none; color: #FFF; width: 400px }
당신은 또한 규칙이 다른 정의 된 규칙에 우선을 만들기 위해! '중요한'추가 기능을 사용할 수 있습니다 될 것입니다. '! 중요한' 많은 사람들이 당신의 CSS 파일에 추가 기능을 사용하여에 대해 을 알려 드릴 것입니다 :
그래서
div.sample { background: none; width: 200px !important }
및
div.sample { color: #FFF; width: 400px }
는
가 div.sample { background: none; color: #FFF; width: 200px !important }
참고가 될 것이다. 개인적으로, 나는 그것을 잘못 본 것이 없다.
본질적으로! important로 잘못된 것은 없지만 불필요하게 사용되면 문제가 발생합니다. 스타일을 덮어 쓰기가 더 어려워집니다 (간단히 말하면 나중에 표시되거나보다 구체적 인 새로운 규칙을 작성하면 더 많은 유연성이 제공됩니다). 속성이 흩어져있는 "중요한 전쟁"에 빠지기는 어렵지 않습니다!이는 서로 다른 (게으른) 개발자가 서로의 규칙을 무시하려고하기 때문에 중요합니다. w3c의 중요한 동기는 사용자가 작성자 스타일 시트를 쉽게 덮어 쓸 수있는 방법을 제공하는 것이 었습니다. – squidbe
각 요소는 선택한 마지막 스타일 시트의 속성을 기반으로 렌더링됩니다. !important;으로 선언 된 속성은 예외입니다. 문제의 일부는 10 개의 스타일 시트가 있다는 것입니다.
위의 모든 답변을 제외하고 모든 파일에 가입하고 PHP 파일 (예 : readfile)을 설정하여 클라이언트에 단일 파일로 제공 할 수 있습니다. 서버와 사용자 모두 감사합니다! – Frankie