样式选择器

/* 外部不起作用的 */
t-button button {
  color: slateblue;
}

<button>click me</button>

<div class="container" style="margin: 1rem 0">
  <t-button>click me 1</t-button>
</div>

<t-button class="two">click me 2</t-button>

class TButton extends HTMLElement {
  constructor() {
    super();
    const shadow = this.attachShadow({ mode: "open" });
    shadow.innerHTML = `
            

            <button><slot/></button>
          `;
    this.shadow = shadow;
  }
}
customElements.define("t-button", TButton);