Ich habe ein kleines Polymer-Element erstellt, um eine 7Segment-Anzeige nachzuahmen, muss das Element die Schriftart fontlibrary.org/face/segment7 laden.Was ist der richtige Weg, um Web-Schrift in einem Polymer-Element zu laden
Wo und wie ist der richtige Weg, um es für das Element zu laden?
Anfangs habe ich gesagt:
<link rel="import" href="../polymer/polymer.html">
<link rel="stylesheet" type="text/css" media="screen" href="https://fontlibrary.org/face/segment7"/>
im Element. Dies funktionierte nicht in Firefox (aber es war in Chrom), also suchte ich mehr und fand www.polymer-project.org/1.0/docs/devguide/styling#style-modules, also änderte ich das Element, um das zu reflektieren, und änderte meinen Code zu:
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="font-segment7.html">
und eine font-segment.html Datei erstellt:
<dom-module id="font-segment7">
<link rel="stylesheet" type="text/css" media="screen" href="https://fontlibrary.org/face/segment7"/>
</dom-module>
das Ergebnis ist das gleiche, in Chrom arbeiten, nicht in firefox (kein Fehler und die Schriftart-Datei segment.html heruntergeladen wird), also frage ich mich, ob diese Art von Indirection dafür gedacht ist, ich denke, es ist mehr für den gemeinsamen Stil und nicht für eine Aufnahme.
Die Demo für das Element ist hier https://potens1.gitlab.io/seven-segment-element/components/seven-segment-element/ und die Code-Repository ist es https://gitlab.com/potens1/seven-segment-element
Ist dies der Weg mit WebComponents zu arbeiten (Polymer?), Oder sollte die Schriftart in der Komponente eingebettet werden?
Vielen Dank.
PS: sorry, nicht genug Ruf Links posten
Hallo, danke für deine Antwort, für die ff Sache verstehe ich nicht warum der 'type = "text/css"' blockiert. Für die Hauptfrage ist der Unterschied, font-roboto wird von vielen Papierelementen verwendet, font-segment7 wird nicht wiederverwendet (oder sehr wenige, denke ich). Ich fand es eine Menge Kesselplatte ohne Nutzen und deshalb frage ich mich über eine gute Nutzung. Es klingt ein bisschen komisch für mich, dass die Schriftart-roboto nicht folgt, was in [doc] erklärt wird (https://www.polymer-project.org/1.0/docs/devguide/styling#style-modules) (kein dom-Modul). – potens
Nun, ein 'dom-Modul' wird verwendet, um ein Element zu konstruieren. Ein Font-Include ist nicht wirklich ein Element, da Sie die Schriftart in dem Element verwenden möchten, in dem Sie es enthalten, und nicht die Schriftart als Element mit eigenem Inhalt verwenden. Du könntest eine Schriftart mit einem Mixin vergleichen (zB [Eisen-Flex-Layout] (https://github.com/PolymerElements/iron-flex-layout/blob/master/iron-flex-layout.html)) welches auch "folgt nicht, was in doc erklärt wird" – Marc