如何选择扩展的自定义元素

Question

我在 example 之后创建了一个自定义元素，但现在 extended-item 不再用作 CSS 选择器。

之前：

<style>
    extended-item {...}
</style>
<extend-item></extended-item>

之后：

<style>
    ??? {...}
</style>
<div is="extended-item"></div>

我尝试了div:extended-item，但它不起作用。有什么想法吗？

[编辑]

这是我的例子extended-item

<link rel="import" href="../libs/polymer/polymer.html">

<polymer-element name="extended-item" noscript extends="div">
    <template>
        <style>
            :host { ... }
        </style>
        ...
    </template>
</polymer-element>

请注意，同时使用 noscript 和 extends 将不允许我直接使用 <extended-item> 语法，而只能使用似乎不适用于选择器的其他 <div is="extended-item"> 语法。以这种方式注册元素是等效的，但可以让我同时使用这两种语法，从而允许选择器工作：

<link rel="import" href="../libs/polymer/polymer.html">

<polymer-element name="extended-item">
    <template>
        <style>
            :host { ... }
        </style>
        ...
    </template>
    <script>
        (function(){ Polymer('extended-item', {extends: 'div'}); })()
    </script>
</polymer-element>

Answer 1

作为评论可能比作为答案更好，但我还不能评论。你说 extended-item 不能作为 css 选择器工作 - 你试过属性选择器 [attr=value] 吗？在你的情况下，也许div[is="extended-item"] { /*styling*/ }