HTML style scoped attribute | Tutorial

Tutorial -- Learning is not just about technology, but also about dreams!

HTML Reference Manual

HTML Tags

HTML <style> scoped Attribute

The scoped attribute is a boolean attribute.

If present, it specifies that the styles are only for the parent element and its descendants.

Note: The scoped attribute is not supported in most browsers.

Example

Use the scoped attribute to style only the current <style> element's parent and its descendants:

<!DOCTYPE html>
<html>
<head>
<style>
p {
  color: red;
}
</style>
</head>
<body>

<p>This paragraph is red.</p>

<div style="border:1px solid black;">
  <p>This paragraph is red.</p>
  <style scoped>
  p {
    color: blue;
  }
  </style>
</div>

<p>This paragraph is red.</p>

</body>
</html>

Browser Support

The numbers in the table specify the first browser version that fully supports the attribute.

Attribute
scoped	Not supported	Not supported	Not supported	Not supported	Not supported

Technical Details

Attribute Value	Description
scoped	A boolean attribute. If present, the style is scoped to the parent element.

HTML tutorial: HTML Style

HTML reference: HTML <style> Tag

YouTip

Att Style Scoped