<style>

개요

HTML Style 요소 (<style>) 는 문서나 문서 일부에 대한 스타일 정보를 포함합니다. 기본적으로, 스타일 지침은 CSS로 예상됩니다.

• 컨텐트 카데고리메타데이터 컨텐트. 만약 scoped 속성이 존재한다면: flow 컨텐트.
• 허용된 컨텐트 type 속성의 언어와 일치하는 스타일 정보
• 태그 생략 None, both the starting and ending tag are mandatory.
• 허용된 부모 요소들 ...
• DOM 인터페이스 HTMLStyleElement

속성

이 요소는 전역 속성을 포함합니다.

type

이 속성은 MIME type으로 스타일링 언어를  정의합니다.(charset은 지정되지 않습니다). 이 속성은 선택적이고, 생략될경우 text/css가 적용됩니다.

media

이 스타일이 적용될 미디어.  이것의 값은 미디어 쿼리이며 생략될경우 기본값 all이 적용됩니다.

scoped

이 값이 존재한다면, 그것의 부모 요소에만 스타일이 적용됩니다. 만약 없다면, 문서 전체에 스타일이 적용됩니다.

title

대체 스타일시트 세트를 지정합니다.

disabled

If set, disables (does not apply) the style rules, specified within the element, to the Document.

예제

간단한 스타일 시트

<style type="text/css">
body {
  color:red;
}
</style> 

scoped 스타일시트

<article>
  <div>The scoped attribute allows for you to include style elements mid-document.
   Inside rules only apply to the parent element.</div>
  <p>This text should be black. If it is red your browser does not support the scoped attribute.</p>
  <section>
    <style scoped>
      p { color: red; }
    </style>
    <p>This should be red.</p>
  </section>
</article>

Live sample

명세

브라우저 호환성

[1] Supported in Chrome 20+ to 34 by enabling the "Enable <style scoped>" or "experimental WebKit features" flag in chrome://flags. Removed in Chrome 35+ due to code complexity.
[2] Gecko 20 and later implement :scope pseudo-classes, but the preference layout.css.scope-pseudo.enabled must be set to true. This is only the case by default in Nightly and Aurora test versions.

참고

• 외부 스타일 시트를 사용하기 위한 <link> 요소.