<style>
HTML <style> Tag
The <style> tag is used to style HTML document with CSS. It defines how elements should be displayed in browsers.
To link to an external style sheet, use the <link> tag.
The information included in the <style> tag is meant for browsers, that’s why the <style> tag is placed inside the <head> element. In case of having scripts in the page, they are placed after CSS code.
It is possible to use more than one <style> element on one page.
In the previous versions of HTML (up to HTML5) and in XHTML use type - <style type=“text/css”> attribute with <style> tag.
Syntax
Syntax
The <style> tag comes in pairs. The content is written between the opening (<style>) and closing (</style>) tags.
Example of the HTML <style> tag:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
h1 {
color: #1c87c9;
}
p {
color: #8ebf42;
}
</style>
</head>
<body>
<h1>Text heading.</h1>
<p>First paragraph.</p>
</body>
</html>
Result
Attributes
Attributes
| Attribute | Value | Description |
|---|---|---|
| media | media_query | Indicates the type of the device which optimizes the style. Styling tables support any device by default. |
| scoped | scoped | Logical attribute indicating that the style applies only to parent and child elements. At the same time <style> tag is not inside the <head> tag. Instead, it is inside the element which it is supposed to style. |
| type | text/css | Indicates which syntax to use to interpret the styles correctly.It is not used in HTML5. |