<style>

Summary

The HTML <style> element contains style information for a document, or a part of document. The specific style information is contained inside of this element, usually in the CSS.

• Content categoriesMetadata content, and if the scoped attribute is present: flow content .
• Permitted content Style information matching the language of the type attribute.
• Tag omission None, both the starting and ending tag are mandatory.
• Permitted parent elements ...
• DOM interface HTMLStyleElement

Attributes

This element includes the global attributes.

type

This attribute defines the styling language as a MIME type (charset should not be specified). 'text/css' is assumed if this attribute is absent.

media

Which media should this style apply to. Should be a media query, see http://dev.w3.org/csswg/css3-mediaqueries.

scoped

If this attribute is present, then the style applies only to its parent element. If absent, the style applies to the whole document.

title

Specifies alternative style sheet sets.

disabled

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

Examples

A simple stylesheet

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

A scoped stylesheet

<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

Specifications

Browser compatibility

[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.

See also

• The <link> element allowing to use external style sheets.