Skip to content
Related Articles

Related Articles

HTML part Attribute

Improve Article
Save Article
  • Last Updated : 06 Jun, 2022
Improve Article
Save Article

The HTML part attribute is a global attribute that can be used to allow CSS to select and style specific elements in the shadow tree through the ::part pseudo-element. 





<!DOCTYPE html>
    <style type="text/css">
        h1 {
            color: green;
        tabbed-custom-element::part(tab) {
            color: green;
            border-bottom: dotted 2px;
            width: 400px;
        <strong>HTML part Attribute</strong>
        <template id="tabbed-custom-element">
            <div part="tab">Hypertext Markup Language</div>
            <div part="tab active">Cascading Style Sheet</div>
            <div part="tab">JavaScript</div>
        // Using the selector to select the
        // part attributes elements
        let template = document
  , class extends HTMLElement {
            constructor() {
                this.attachShadow({ mode: "open" });


Supported Browsers:

  • Google Chrome 73 and above
  • Firefox 72 and above
  • Safari 13.1 and above
  • Opera 60 and above
  • Edge 79 and above

My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!