2016-03-25 11 views
6

Il polimero ha il supporto per <style is="custom-style"> che consente di definire gli stili che si applicano solo agli elementi, ad es. il DOM ombra.stile personalizzato e stili condivisi in polimero

Polymer ha anche il supporto per <dom-module id="shared-styles"> che consente di impacchettare un insieme di dichiarazioni di stile che possono essere importate in una definizione di elemento.

Quindi il punto di entrambi sembra essere quello di consentire di modellare un elemento polimerico. Perché dovresti usarne uno sull'altro? I casi d'uso si sovrappongono sostanzialmente, a quanto pare.

Confusione aggiuntiva: shared-styles può essere importato in custom-style. Perché dovresti farlo? Perchè no?

risposta

13

A <dom-module id="my-shared-styles"> dichiara un modulo di stile riutilizzabile che è possibile importare in elementi o tag <style is="custom-style">.

Usa in un elemento personalizzato

<dom-module id="my-element> 
    <template> 
    <style include="my-shared-styles"></style> 
    ... 
    </template> 
</dom-module> 

o nel <style> tag di fuori di un elemento personalizzato (per esempio in <head>)

<head> 
    <style is="custom-style" include="my-shared-styles"></style> 
</head> 

<style is="custom-style"> è necessario solo quando si desidera utilizzare le funzioni Polymer CSS (Variabili CSS e mixin) in un elemento di stile che non si trova all'interno di un <dom-module>. Dentro lo <dom-module> è sufficiente solo il <style>.

+0

C'è qualche problema che può essere risolto solo con una tecnica ma non con l'altra? –

+0

Entrambi supportano le funzionalità CSS polimeriche. La differenza è l'ambito in cui vengono applicati gli stili. I CSS in '