Posso creare uno stile modello esterno?

Question

in GOOGLE PILIMER LEZIONE 1 , hannoUn esempio che include un foglio di stili in linea. Mi piacerebbe spostarlo in un file CSS, ma lo stile è all'interno di un tag modello. Per peggiorare le cose, dice che è

.

Utilizzato all'interno di un albero dell'ombra, il: host pseudo-class corrisponde al elemento che ospita l'albero.In questo caso, corrisponde al elemento.

Q: Posso spostare questo stile in un file CSS?

Answer 1

Se si desidera stilare gli elementi che fanno parte di un elementi personalizzati Shadow Dom è necessario utilizzare il selettore ::shadow o il selettore /deep/ se si desidera selezionare elementi indipendentemente dal numero di livelli profondi si siedono all'interno di Shadow Dom.

.

Allora dall'esterno, ti eleggeresti un elemento p che è all'interno del Dom Shadow Dom x-foo come questo:

x-foo::shadow p {

}

.

Puoi leggere tutte quelle cose qui: http://www.polymer-project.org/articles/styling-elements.html

Answer 2

Se si scarica l'elemento seme da Questa pagina (o soloGuarda i contenuti elencati), vedrai che utilizza un file CSS esterno.Puoi esaminare l'elemento HTML per vedere come è usato, ma è molto semplice:

<polymer-element name="seed-element" attributes="notitle author">

  <template>

    <link rel="stylesheet" href="seed-element.css" />

    <h1>Hello from seed-element</h1>
    <content></content>

  </template>
  <script>

    Polymer('seed-element', {
      //...
    }
  </script>
</polymer-element>

.

Allora in Seed-Element.css per impostazione predefinita Hai il seguente:

:host {
  display: block;
}

.

Il modo in cui lo capisco (nella mia consapevolezza limitata) è che se dovessi rinominare il seme-elemento al mio elemento, questo sarebbe lo stesso di

my-element {
  display: block;
}

.