번역 작업 진행중입니다.

HTML Style 요소 (<style>) 는 문서나 문서 일부에 대한 스타일 정보를 포함합니다.

속성

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

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>

명세

명세 상태 주석
HTML Living Standard
The definition of 'style' in that specification.
Living Standard HTML5 에서 변화 없음.
HTML5
The definition of 'style' in that specification.
Recommendation scoped 속성이 추가됨
HTML 4.01 Specification
The definition of 'style' in that specification.
Recommendation  

브라우저 호환성

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
styleChrome Full support 1Edge Full support YesFirefox Full support 1IE Full support 3Opera Full support 3.5Safari Full support 1WebView Android Full support 1Chrome Android Full support 18Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support 1Samsung Internet Android Full support Yes
mediaChrome Full support 1Edge Full support YesFirefox Full support 1IE Full support 3Opera Full support 3.5Safari Full support 1WebView Android Full support 1Chrome Android Full support 18Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support 1Samsung Internet Android Full support Yes
scoped
DeprecatedNon-standard
Chrome No support 19 — 35
Disabled
No support 19 — 35
Disabled
Disabled From version 19 until version 35 (exclusive): this feature is behind the Enable <style scoped> preference (needs to be set to true). To change preferences in Chrome, visit chrome://flags.
Edge No support NoFirefox No support 55 — 61
Notes Disabled
No support 55 — 61
Notes Disabled
Notes This attribute was hidden behind a pref because no other browsers support it (See bug 1291515).
Disabled From version 55 until version 61 (exclusive): this feature is behind the layout.css.scoped-style.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
No support 21 — 55
IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoEdge Mobile No support NoFirefox Android No support 55 — 61
Notes Disabled
No support 55 — 61
Notes Disabled
Notes This attribute was hidden behind a pref because no other browsers support it (See bug 1291515).
Disabled From version 55 until version 61 (exclusive): this feature is behind the layout.css.scoped-style.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
No support 21 — 55
Opera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
titleChrome Full support 1Edge Full support YesFirefox Full support 1IE Full support 3Opera Full support 3.5Safari Full support 1WebView Android Full support 1Chrome Android Full support 18Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support 1Samsung Internet Android Full support Yes
typeChrome Full support 1Edge Full support YesFirefox Full support 1IE Full support 3Opera Full support 3.5Safari Full support 1WebView Android Full support 1Chrome Android Full support 18Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support 1Samsung Internet Android Full support Yes

Legend

Full support  
Full support
No support  
No support
Non-standard. Expect poor cross-browser support.
Non-standard. Expect poor cross-browser support.
Deprecated. Not for use in new websites.
Deprecated. Not for use in new websites.
See implementation notes.
See implementation notes.
User must explicitly enable this feature.
User must explicitly enable this feature.

참고

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

문서 태그 및 공헌자

이 페이지의 공헌자: alattalatta, mdnwebdocs-bot, azunyan3
최종 변경자: alattalatta,