Frage

Ich sehnte mich nach der Einbeziehung von FontAwesome-Symbolen in Primefaces, und schließlich hat Optimus gestern dieses tolle Neue gepostet.-> http://blog.primefaces.org/?p=3004#comment-5422

Integriert von Max Dicson Wir sollten sie nun nutzen können.

Wenn ich mir jedoch das Tutorial-Video anschaue, kann ich es nicht herausfinden.

  • Verwendung von PF4.0, aber JSF 2.1 (der einzige Unterschied zum Video)
  • Das letzte maven-FontAwesome.jar hinzugefügt --> http://mvnrepository.com/artifact/org.webjars/font-awesome/4.0.3

  • Die MIME-Typen wurden zur Datei web.xml hinzugefügt

  • Aufruf der entsprechenden CSS-Datei mit <h:outputStylesheet name="webjars/font-awesome/4.0.3/css/font-awesome.css">

Aber ich kann meinen gewünschten Fab-Bug nicht bekommen.

Irgendeine Idee?Danke!

War es hilfreich?

Lösung

Das ^ kann mit

entfernt werden generasacodicetagpre.

Andere Tipps

Es scheint, dass dies bereits geschlossen wurde, jedoch nur für den Fall, dass jemand anstelle der gewünschten Symbole in diese Probleme von "^" läuft.Ich möchte nicht nur das "^" verstecken, sondern haben die eigentlichen Bilder, wie dies, wie ich das ursprüngliche Problem verstanden habe.

Wenn etwas so etwas kommt [1]: http://i.stack.imgur.com / 5gphz.jpg

Verwenden Sie das neueste Ur-Urlaub, der das FontAwesome aus der Box unterstützt, um sicherzustellen, dass der Balg korrekt ist, kann helfen, möglicherweise

    .

  1. in Ihrem web.xml Hinzufügen: 

    <context-param>
    <param-name>primefaces.FONT_AWESOME</param-name>
    <param-value>true</param-value>
</context-param>

  2. In Ihrem * .XHTML, wo Sie fontawesome Symbole hinzufügen möchten, zeigen Sie zwischen Kopf-Tags auf die font-fantastische CSS des JAR, das Sie haben: 

    <h:outputStylesheet name="webjars/font-awesome/4.4.0/css/font-awesome.css">

  3. Verweisungen schließlich ordnungsgemäß ordnungsgemäß ordnungsgemäß. 

    <p:button outcome="add-user-form" value="Add User" icon="fa fa-user-plus">
     <f:param name="productId" value="10" />
</p:button>

    4. das hat mir geholfen.

    jubeln

Für die ^ Problem, Sie könnten folgenden CSS-Stil hinzufügen:

.ui-icon.fa {
    text-indent:0px
}

Dies überschreibt die Primflächen .ui-icon style {text-indent:-99999px}.....

In meinem Fall sah das Symbol dann kaputt aus.Ich hatte einen 404-Fehler in der Firebug-Konsole (NetworkError für woff oder ttf).Für mich war folgender Link die Lösung: Verhindern Sie, dass Suffixe beim Laden der Seite zu Ressourcen hinzugefügt werden

http://www.primefaces.org/showcase/ui/misc/FA.XHTML Überprüfen Sie die offizielle Demo, und Sie können das Dokument finden, das Sie sagen, dass Sie einige hinzufügen sollten, also folgen Sie der Anweisung.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top