Description

The HTML element <style> is used to define document-level style rules, which apply only to the specific document.

  • A document can contain any number of <style> elements.
  • It must appear only within the <head> element of a document.

Using the <style> element is good while experimenting with CSS styles, but it has disadvantages. So, the best way to add styles to a document is by linking external style sheets.

The below table summarizes its usage.

Usage Details
Placement It is a child of <head> element.
Contents It can contain any CSS rules.
Tags Both the opening and closing tags are required.
Versions HTML 4, 4.01, 5

Syntax

Here is the basic syntax of the <style> element.

<style>...</style>

Examples

Run this on IDE

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Example - HTML Element style</title>
    <style>
        h1 { color: red; }
    </style>
</head>
<body>
    <h1>HTML Element style</h1>
</body>
</html>

Attributes

The following table shows the list of supported and unsupported attributes for the <style> element.

Attribute Type Details
Element-Specific Attributes The tag <style> has some element-specific attributes listed in the below table.
Global Attributes Like all other HTML tags, the tag <style> supports the HTML Global Attributes.
Event Attributes The tag <style> also supports the HTML Event Attributes.

Here is a list of attributes that are specific to the <style> element.

Attribute Value Required Description
type content-type No Specifies the styling language which is generally text/css for CSS.
media media-type No Specifies the media type that the styles must apply to.
The value can be a single media (e.g. media="screen") or a comma-separated list (e.g. media="screen, print").
scoped  scoped No Specifies that the styles apply only to its parent element, and its child nodes.
If this attribute is absent, the styles apply to the whole document.

Browser Compatibility

The tag <style> is supported in all modern browsers.

  • Google Chrome 1+
  • Internet Explorer or Edge 3+
  • Firefox 1+
  • Apple Safari 1+
  • Opera 4+

Related Links