如何选择web组件的shadow-dom::part()的:第一个子项

Question

我正在尝试增加web组件网格元素中Left单元格的填充。(它不是基于HTML表-没有etc-行和单元格。(

这是渲染web组件的部分示例：

<div class="row" part="row" first="" style="position: absolute; left: 0px; min-width: 100%;">
<div class="cell" part="cell" halign="left" valign="top" style="min-height: 48px;">
<label part="cell-label">empty</label>
</div>
<div class="cell" part="cell" halign="left" valign="top" style="min-height: 48px;">
<label part="cell-label">label text</label>
</div>
<div class="cell" part="cell" halign="left" valign="top" style="min-height: 48px;">
<span style="overflow: hidden; min-height: 32px; display: flex; align-items: flex-start;">
5 Parts</span>
</div>
</div>

使用部分语法(即部分="行"和部分="单元格"(来暴露行和单元格。我可以定位单元格部分并增加填充，但它适用于每个单元格：

grid::part(core-grid)::part(cell){
padding-left: 24px !important;
}

当我添加：第一个孩子没有应用填充：

grid::part(core-grid)::part(cell):first-child {
padding-left: 24px !important;
}

单元格的父级是一行，因此两者都暴露在全局CSS中。感觉我离解决方案很近了。。。

Answer 1

不幸的是，规范(https://drafts.csswg.org/css-shadow-parts-1/#part)声明part:不支持使用"结构伪类"，如:first-child

：：part((伪元素可以在它之后获得额外的伪类，例如x-button:：part((label(：hover，但永远不会匹配基于树信息而非本地元素信息匹配的结构伪类或任何其他伪类。