HTML part 属性

part 是一个布尔值的全局属性。它定义了一个与元数据关联的数据项。就是说一个元素的 itemscope 属性会创建一个项，包含了一组与元素相关的键值对。

实例

<!DOCTYPE html>
<html>
    <style>
    c-e::part(active) {
        color: deepskyblue;
    }
    c-e::part(textspan) {
        font-size: 20px;
    }
    </style>
<body>
<template id="c-e-template">
  <p part="textspan active">文字颜色是深天空蓝！</p>
  <p part="textspan">文字颜色是麻瓜黑！</p>
</template>
<c-e></c-e>
<script>
let template = document.getElementById('c-e-template');
globalThis.customElements.define('c-e', class extends HTMLElement {
  constructor() {
    super();
    this.attachShadow({ mode: "open" });
    this.shadowRoot.appendChild(template.content);
  }
});
</script>
</body>
</html>

运行一下

浏览器支持

属性
part	Yes	No	Yes	Yes	Yes

只有 IE 浏览器不支持 part 属性。

定义和用法

part 是一个布尔值的全局属性。它定义了一个与元数据关联的数据项。就是说一个元素的 itemscope 属性会创建一个项，包含了一组与元素相关的键值对。

语法

part="textspan active"

HTML part 属性

实例

浏览器支持

定义和用法

语法

分类导航