오류 줄 16, 23 열 :이 컨텍스트에서 요소 스타일은 요소 본문의 자식으로 허용되지 않습니다. (이 하위 트리에서 추가 오류를 억제.)HTML 5 Validator는 CSS가 본문에 포함 된 것을 원하지 않습니다.
는 "이런 맥락에서"SAIS 때문에 내가 거기에 기대하고있어 "
<style TYPE="text/css">
</style>
하고 다른를 사용하여 CSS 내 HTML 5를 삽입하는 방법입니다 문맥 "을 의미합니다.
깔끔한 HTML 5/CSS 모듈에 모든 코드가 포함되어 있습니다. 대부분의 사람들이 이런 식으로 생각한다고 생각하지만 내 CSS를 HTML에서 분리하지 않는 것을 선호합니다.
내 HTML 5가 포함 된 CSS를 유지하고 유효성 검사를 중단 할 수있는 방법이 있습니까?
포함되지 않은 경우 문서의 헤드에 CSS를 넣을 수 있습니까?
어디에 넣을 수 있습니까?
scoped 속성이, 예를 들어, 존재하지 않는 style 태그는 head 태그에 간다 :
<!DOCTYPE html>
<html>
<head>
<title>HTML5 CSS scope attribute</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<style>
.myClass {
color: red;
background-color: blue;
}
</style>
</head>
<body>
<div>
<span class="myClass">This text is red, and the background is blue.</span>
</div>
<div>
<style scoped>
.myClass {
background-color: yellow;
}
</style>
<span class="myClass">This text is red, and the background is yellow.</span>
</div>
</body>
그러나, scoped 속성이 아직 모든 브라우저에서 구현되지 않습니다
2 년 후, 파이어 폭스를 제외하고, 어떤 브라우저도 스코프 된 속성을 구현하지 못했습니다. 다른 브라우저에서이 기능을 구현하지 않는 것 같습니다. http://caniuse.com/style-scoped – trante
스타일 태그는 헤드 섹션 내에서만 허용됩니다.
태그가있는 인라인 스타일 또는 인라인 스타일로서, 그렇게해야하는 정당한 이유가있는 경우에만 수행해야합니다.
<script> 태그와 달리 <style>은 <head> 섹션에서만 사용할 수 있습니다. 그래서 오류가 발생합니다. <head></head> 태그 사이에 넣으십시오.
그러나 여전히 몸에 스타일을 사용할 수 있습니다 여전히 유효한 코드를 가지고 있지만, 조금 다른 방식이다. 요소의 style 속성에 입력해야합니다.
예 :
당신은 당신의 코드가 유효하려면 유일한 방법<span style="background-color: #000; color: #fff;">Some text here</span>
. <style></style>태그, 속성 만 사용할 수 있습니다.
style은 문서의 head에서만 실행됩니다. 외부 스타일 시트를 실행하거나 dev에서 html 파일에 포함 시키십시오. 단계.
유효성 검사기 오류 문자 그대로 body 요소의 시작 부분에 style 요소가있는 경우 오류가 발생합니다.메시지의 설명에서 알 수 있듯이 scoped 속성이 사용된다면 그러한 구성이 허용됩니다.
scoped 속성을 사용하면 브라우저가 아직 구현되지 않았으므로 무의미하지만 사용하는 경우 향후 브라우저가 현재 브라우저와 완전히 다른 요소로 해석 될 수 있습니다. 위의 내용은 공식적인 측면입니다.
style 속성이없는 요소는 body에 배치 된 경우에도 브라우저에서 작동합니다. 공식 규칙은 HTML5를 금지하고 있습니다. HTML5는 현재 제시된 유스 케이스가 중요하지 않다고 편집자가 생각하기 때문에 그대로 사용합니다.
그러나 style 요소를 head 요소 안에 넣는 것이 좋습니다. 여기서 모든 사양으로 유효합니다. (저자는 head에 대한 관리 권한이 없지만 body에 코드를 삽입 할 수 경우에만 body에 넣어의 필요성은 일반적으로 발생한다.)
어떤 상황에서 검증에 사용 "이 맥락에서"문구는, 틀림없이 혼란 . 나는 오래 전에 제안한 약간의 변화로 인해 더 나쁜 (오도 된) 공식을 피하기 위해서라고 생각한다. 표현은 의미가 있습니다. 마크 업이 style 속성 때문에, HTML5 규칙에 의해 잘못
<div>
foo
<style scoped></style>
</div>
경우 body 내에서 사용하는 경우, 부모의 시작 부분에 표시되어야합니다. 컨텍스트가 변경되고 style 요소 뒤에 "foo"가 제거되거나 이동되면 마크 업이 HTML5 준수로 바뀝니다.
호기심 때문에 외부 스타일 시트를 사용하지 않으시겠습니까? –
마지막 문장의 내용을 확실하게 알지 못합니다. 왜 문서 머리에 넣을 수 없습니까? – BoltClock
개발 단계에서 문서의 유효성에 대해 왜 신경 씁니까? 당신이 염려한다면, 당신이 속한 머리에 그것을 놓을 수도 있고, 문서를 위아래로 스크롤하거나 에디터 창을 복제하는 것과 함께 살 수도 있습니다. – BoltClock