HTML5 <style> Tag

Example

Use of the style element in an HTML document:

<html>
<head>
<style type="text/css">
h1 {color:red}
p {color:blue}
</style>
</head>

<body>
<h1>Header 1</h1>
<p>A paragraph.</p>
</body>
</html>

Try it yourself »

Definition and Usage

The <style> tag is used to define style information for an HTML document.

In the style element you specify how HTML elements should render in a browser.

Differences Between HTML 4.01 and HTML5

The scoped attribute is new in HTML5, which allows you to define styles for a specified section of your document, instead of the entire document.

If the "scoped" attribute is present, the styles only apply to the style elements parent element and its child elements.

Tips and Notes

Tip: To link to an external style sheet, use the <link> tag.

Tip: To learn more about style sheets, visit our CSS Tutorial.

Note: If the scoped attribute is NOT defined, the <style> element must be placed in the <head> section.

Attributes

New : New in HTML5.

Attribute	Value	Description
type	text/css	Defines the content-type
media	media query	Specifies what media/device the media resource is optimized for. Default value: all.
scopedNew	scoped	If present, the styles should ONLY apply to the style elements parent element and its child elements.

Standard Attributes

The <style> tag also supports the Standard Attributes in HTML5.

Event Attributes

The <style> tag also supports the Event Attributes in HTML5.