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>
Code it Online »

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

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

Hint: 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

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

Have Any Suggestion? We Are Waiting To Hear from YOU!

Your Query was successfully sent!