Font Awesome - Webanwendungssymbole
In diesem Kapitel wird die Verwendung von Font Awesome-Webanwendungssymbolen erläutert. Annehmen, dasscustom ist der CSS-Klassenname, in dem wir die Größe und Farbe definiert haben, wie im folgenden Beispiel gezeigt.
<html>
<head>
<link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css">
<style>
i.custom {font-size: 2em; color: gray;}
</style>
</head>
<body>
<i class = "fa fa-adjust custom"></i>
</body>
</html>Die folgende Tabelle zeigt die Verwendung und die Ergebnisse der Symbole für Font Awesome-Webanwendungen. Ersetzen Sie das <body> -Tag des obigen Programms durch den in der Tabelle angegebenen Code, um die entsprechenden Ausgaben zu erhalten -
| Verwendung | Ergebnis |
|---|---|
| <i class = "fa fa-adjust custom"> </ i> | |
| <i class = "fa fa-anchor custom"> </ i> | |
| <i class = "fa fa-archive custom"> </ i> | |
| <i class = "fa fa-area-chart custom"> </ i> | |
| <i class = "fa fa-arrows custom"> </ i> | |
| <i class = "fa fa-arrows-h custom"> </ i> | |
| <i class = "fa fa-arrows-v custom"> </ i> | |
| <i class = "fa fa-asterisk custom"> </ i> | |
| <i class = "fa fa-at custom"> </ i> | |
| <i class = "fa fa-automobile custom"> </ i> | |
| <i class = "fa fa-balance-scale custom"> </ i> | |
| <i class = "fa fa-ban custom"> </ i> | |
| <i class = "fa fa-bank custom"> </ i> | |
| <i class = "fa fa-bar-chart custom"> </ i> | |
| <i class = "fa fa-Balkendiagramm-o benutzerdefiniert"> </ i> | |
| <i class = "fa fa-barcode custom"> </ i> | |
| <i class = "fa fa-bar custom"> </ i> | |
| <i class = "fa fa-bed custom"> </ i> | |
| <i class = "fa fa-bier custom"> </ i> | |
| <i class = "fa fa-bell custom"> </ i> | |
| <i class = "fa fa-wrench custom"> </ i> | |
| <i class = "fa fa-bell-o custom"> </ i> | |
| <i class = "fa fa-bell-slash custom"> </ i> | |
| <i class = "fa fa-bell-slash-o custom"> </ i> | |
| <i class = "fa fa-bicycle custom"> </ i> | |
| <i class = "fa fa-batterie-0 custom"> </ i> | |
| <i class = "fa fa-batterie-1 custom"> </ i> | |
| <i class = "fa fa-batterie-2 custom"> </ i> | |
| <i class = "fa fa-batterie-3 custom"> </ i> | |
| <i class = "fa fa-batterie-4 custom"> </ i> | |
| <i class = "fa fa-batterie-leer custom"> </ i> | |
| <i class = "fa fa-batterie-viertel benutzerdefiniert"> </ i> | |
| <i class = "fa fa-batterie-halb benutzerdefiniert"> </ i> | |
| <i class = "fa fa-batterie-drei viertel custom"> </ i> | |
| <i class = "fa fa-batterie-voll benutzerdefiniert"> </ i> | |
| <i class = "fa fa-geburtstagstorte custom"> </ i> | |
| <i class = "fa fa-bolzen custom"> </ i> | |
| <i class = "fa fa-bomb custom"> </ i> | |
| <i class = "fa fa-book custom"> </ i> | |
| <i class = "fa fa-bookmark custom"> </ i> | |
| <i class = "fa fa-bookmark-o custom"> </ i> | |
| <i class = "fa fa-briefcase custom"> </ i> | |
| <i class = "fa fa-bug custom"> </ i> | |
| <i class = "fa fa-building custom"> </ i> | |
| <i class = "fa fa-building-o custom"> </ i> | |
| <i class = "fa fa-bullhorn custom"> </ i> | |
| <i class = "fa fa-bullseye custom"> </ i> | |
| <i class = "fa fa-bus custom"> </ i> | |
| <i class = "fa fa-cab custom"> </ i> | |
| <i class = "fa fa-video-camera custom"> </ i> | |
| <i class = "fa fa-calendar custom"> </ i> | |
| <i class = "fa fa-calendar-check-o custom"> </ i> | |
| <i class = "fa fa-calendar-minus-o custom"> </ i> | |
| <i class = "fa fa-calendar-o custom"> </ i> | |
| <i class = "fa fa-calendar-plus-o custom"> </ i> | |
| <i class = "fa fa-calendar-times-o custom"> </ i> | |
| <i class = "fa fa-camera custom"> </ i> | |
| <i class = "fa fa-camera-retro custom"> </ i> | |
| <i class = "fa fa-car custom"> </ i> | |
| <i class = "fa fa-cc custom"> </ i> | |
| <i class = "fa fa-caret-square-o-down custom"> </ i> | |
| <i class = "fa fa-caret-square-o-left custom"> </ i> | |
| <i class = "fa fa-caret-square-o-right custom"> </ i> | |
| <i class = "fa fa-caret-square-o-up custom"> </ i> | |
| <i class = "fa fa-cart-Pfeil nach unten benutzerdefiniert"> </ i> | |
| <i class = "fa fa-cart-plus custom"> </ i> | |
| <i class = "fa fa-certificate custom"> </ i> | |
| <i class = "fa fa-child custom"> </ i> | |
| <i class = "fa fa-check custom"> </ i> | |
| <i class = "fa fa-check-circle custom"> </ i> | |
| <i class = "fa fa-check-circle-o custom"> </ i> | |
| <i class = "fa fa-check-square custom"> </ i> | |
| <i class = "fa fa-check-square-o custom"> </ i> | |
| <i class = "fa fa-circle custom"> </ i> | |
| <i class = "fa fa-circle-o custom"> </ i> | |
| <i class = "fa fa-circle-o-notch custom"> </ i> | |
| <i class = "fa fa-circle-thin custom"> </ i> | |
| <i class = "fa fa-clock-o custom"> </ i> | |
| <i class = "fa fa-clone custom"> </ i> | |
| <i class = "fa fa-close custom"> </ i> | |
| <i class = "fa fa-anchor custom"> </ i> | |
| <i class = "fa fa-cloud-download custom"> </ i> | |
| <i class = "fa fa-cloud-upload custom"> </ i> | |
| <i class = "fa fa-code custom"> </ i> | |
| <i class = "fa fa-code-fork custom"> </ i> | |
| <i class = "fa fa-kaffee custom"> </ i> | |
| <i class = "fa fa-cog custom"> </ i> | |
| <i class = "fa fa-cogs custom"> </ i> | |
| <i class = "fa fa-comment custom"> </ i> | |
| <i class = "fa fa-comment-o custom"> </ i> | |
| <i class = "fa fa-commenting custom"> </ i> | |
| <i class = "fa fa-commenting-o custom"> </ i> | |
| <i class = "fa fa-Kommentare benutzerdefiniert"> </ i> | |
| <i class = "fa fa-comment-o custom"> </ i> | |
| <i class = "fa fa-kompass custom"> </ i> | |
| <i class = "fa fa-copyright custom"> </ i> | |
| <i class = "fa fa-creative-commons custom"> </ i> | |
| <i class = "fa fa-Kreditkarte benutzerdefiniert"> </ i> | |
| <i class = "fa fa-crop custom"> </ i> | |
| <i class = "fa fa-crosshairs custom"> </ i> | |
| <i class = "fa fa-cube custom"> </ i> | |
| <i class = "fa fa-cubes custom"> </ i> | |
| <i class = "fa fa-Besteck benutzerdefiniert"> </ i> | |
| <i class = "fa fa-dashboard custom"> </ i> | |
| <i class = "fa fa-database custom"> </ i> | |
| <i class = "fa fa-desktop custom"> </ i> | |
| <i class = "fa fa-diamant custom"> </ i> | |
| <i class = "fa fa-dot-circle-o custom"> </ i> | |
| <i class = "fa fa-download custom"> </ i> | |
| <i class = "fa fa-edit custom"> </ i> | |
| <i class = "fa fa-ellipsis-h custom"> </ i> | |
| <i class = "fa fa-ellipsis-v custom"> </ i> | |
| <i class = "fa fa-umschlag benutzerdefiniert"> </ i> | |
| <i class = "fa fa-umschlag-o benutzerdefiniert"> </ i> | |
| <i class = "fa fa-Envelope-Square Custom"> </ i> | |
| <i class = "fa fa-eraser custom"> </ i> | |
| <i class = "fa fa-exchange custom"> </ i> | |
| <i class = "fa fa-exclamation custom"> </ i> | |
| <i class = "fa fa-Ausrufezeichen-Kreis benutzerdefiniert"> </ i> | |
| <i class = "fa fa-Ausrufezeichen-Dreieck benutzerdefiniert"> </ i> | |
| <i class = "fa fa-external-link custom"> </ i> | |
| <i class = "fa fa-external-link-square custom"> </ i> | |
| <i class = "fa fa-eye custom"> </ i> | |
| <i class = "fa fa-eye-slash custom"> </ i> | |
| <i class = "fa fa-eyedropper custom"> </ i> | |
| <i class = "fa fa-fax custom"> </ i> | |
| <i class = "fa fa-feed custom"> </ i> | |
| <i class = "fa fa-female custom"> </ i> | |
| <i class = "fa fa-kämpferjet custom"> </ i> | |
| <i class = "fa fa-file-archive-o custom"> </ i> | |
| <i class = "fa fa-file-audio-o custom"> </ i> | |
| <i class = "fa fa-file-code-o custom"> </ i> | |
| <i class = "fa fa-file-excel-o custom"> </ i> | |
| <i class = "fa fa-volume-down custom"> </ i> | |
| <i class = "fa fa-file-movie-o custom"> </ i> | |
| <i class = "fa fa-file-pdf-o custom"> </ i> | |
| <i class = "fa fa-file-photo-o custom"> </ i> | |
| <i class = "fa fa-file-picture-o custom"> </ i> | |
| <i class = "fa fa-file-powerpoint-o custom"> </ i> | |
| <i class = "fa fa-file-sound-o custom"> </ i> | |
| <i class = "fa fa-file-video-o custom"> </ i> | |
| <i class = "fa fa-file-word-o custom"> </ i> | |
| <i class = "fa fa-file-sound-o custom"> </ i> | |
| <i class = "fa fa-file-video-o custom"> </ i> | |
| <i class = "fa fa-file-word-o custom"> </ i> | |
| <i class = "fa fa-file-zip-o custom"> </ i> | |
| <i class = "fa fa-film custom"> </ i> | |
| <i class = "fa fa-filter custom"> </ i> | |
| <i class = "fa fa-fire custom"> </ i> | |
| <i class = "fa fa-Feuerlöscher benutzerdefiniert"> </ i> | |
| <i class = "fa fa-flag custom"> </ i> | |
| <i class = "fa fa-flag-checkered custom"> </ i> | |
| <i class = "fa fa-flag-o custom"> </ i> | |
| <i class = "fa fa-flash custom"> </ i> | |
| <i class = "fa fa-flask custom"> </ i> | |
| <i class = "fa fa-flask custom"> </ i> | |
| <i class = "fa fa-folder custom"> </ i> | |
| <i class = "fa fa-folder-o custom"> </ i> | |
| <i class = "fa fa-folder-open custom"> </ i> | |
| <i class = "fa fa-folder-open-o custom"> </ i> | |
| <i class = "fa fa-frown-o custom"> </ i> | |
| <i class = "fa fa-volume-off custom"> </ i> | |
| <i class = "fa fa-gamepad custom"> </ i> | |
| <i class = "fa fa-gavel custom"> </ i> | |
| <i class = "fa fa-gear custom"> </ i> | |
| <i class = "fa fa-gears custom"> </ i> | |
| <i class = "fa fa-gift custom"> </ i> | |
| <i class = "fa fa-glass custom"> </ i> | |
| <i class = "fa fa-globus custom"> </ i> | |
| <i class = "fa fa-graduierungskappe benutzerdefiniert"> </ i> | |
| <i class = "fa fa-group custom"> </ i> | |
| <i class = "fa fa-hand-grab-o custom"> </ i> | |
| <i class = "fa fa-hand-lizard-o custom"> </ i> | |
| <i class = "fa fa-hand-paper-o custom"> </ i> | |
| <i class = "fa fa-hand-peace-o custom"> </ i> | |
| <i class = "fa fa-handzeiger-o benutzerdefiniert"> </ i> | |
| <i class = "fa fa-hand-rock-o custom"> </ i> | |
| <i class = "fa fa-handschere-o custom"> </ i> | |
| <i class = "fa fa-hand-spock-o custom"> </ i> | |
| <i class = "fa fa-hand-paper-o custom"> </ i> | |
| <i class = "fa fa-hdd-o custom"> </ i> | |
| <i class = "fa fa-headphones custom"> </ i> | |
| <i class = "fa fa-heart custom"> </ i> | |
| <i class = "fa fa-heart-o custom"> </ i> | |
| <i class = "fa fa-heartbeat custom"> </ i> | |
| <i class = "fa fa-history custom"> </ i> | |
| <i class = "fa fa-home custom"> </ i> | |
| <i class = "fa fa-hotel custom"> </ i> | |
| <i class = "fa fa-sanduhr custom"> </ i> | |
| <i class = "fa fa-Sanduhr-Start benutzerdefiniert"> </ i> | |
| <i class = "fa fa-Sanduhr-halbe Gewohnheit"> </ i> | |
| <i class = "fa fa-Sanduhr-Ende benutzerdefiniert"> </ i> | |
| <i class = "fa fa-i-cursor custom"> </ i> | |
| <i class = "fa fa-image custom"> </ i> | |
| <i class = "fa fa-inbox custom"> </ i> | |
| <i class = "fa fa-industrial custom"> </ i> | |
| <i class = "fa fa-info custom"> </ i> | |
| <i class = "fa fa-info-circle custom"> </ i> | |
| <i class = "fa fa-institution custom"> </ i> | |
| <i class = "fa fa-key custom"> </ i> | |
| <i class = "fa fa-keyboard-o custom"> </ i> | |
| <i class = "fa fa-language custom"> </ i> | |
| <i class = "fa fa-Laptop custom"> </ i> | |
| <i class = "fa fa-leaf custom"> </ i> | |
| <i class = "fa fa-legal custom"> </ i> | |
| <i class = "fa fa -itrone-o custom"> </ i> | |
| <i class = "fa fa-level-down custom"> </ i> | |
| <i class = "fa fa-level-up custom"> </ i> | |
| <i class = "fa fa-life-bouy custom"> </ i> | |
| <i class = "fa fa-life-ring custom"> </ i> | |
| <i class = "fa fa-life-saver custom"> </ i> | |
| <i class = "fa fa-glühbirne-o custom"> </ i> | |
| <i class = "fa fa-Liniendiagramm benutzerdefiniert"> </ i> | |
| <i class = "fa fa-location-arrow custom"> </ i> | |
| <i class = "fa fa-lock custom"> </ i> | |
| <i class = "fa fa-magic custom"> </ i> | |
| <i class = "fa fa-magnet custom"> </ i> | |
| <i class = "fa fa-mail-forward custom"> </ i> | |
| <i class = "fa fa-mail-reply custom"> </ i> | |
| <i class = "fa fa-mail-reply-all custom"> </ i> | |
| <i class = "fa fa-male custom"> </ i> | |
| <i class = "fa fa-map custom"> </ i> | |
| <i class = "fa fa-map-marker custom"> </ i> | |
| <i class = "fa fa-map-o custom"> </ i> | |
| <i class = "fa fa-map-pin custom"> </ i> | |
| <i class = "fa fa-map-sign benutzerdefiniert"> </ i> | |
| <i class = "fa fa-meh-o custom"> </ i> | |
| <i class = "fa fa-microphone custom"> </ i> | |
| <i class = "fa fa-microphone-slash custom"> </ i> | |
| <i class = "fa fa-minus custom"> </ i> | |
| <i class = "fa fa-minus-circle custom"> </ i> | |
| <i class = "fa fa-minus-square custom"> </ i> | |
| <i class = "fa fa-minus-square-o custom"> </ i> | |
| <i class = "fa fa-mobile custom"> </ i> | |
| <i class = "fa fa-money custom"> </ i> | |
| <i class = "fa fa-moon-o custom"> </ i> | |
| <i class = "fa fa-mortar-board custom"> </ i> | |
| <i class = "fa fa-motorrad custom"> </ i> | |
| <i class = "fa fa-Mauszeiger benutzerdefiniert"> </ i> | |
| <i class = "fa fa-music custom"> </ i> | |
| <i class = "fa fa-users custom"> </ i> | |
| <i class = "fa fa-object-group custom"> </ i> | |
| <i class = "fa fa-object-ungroup custom"> </ i> | |
| <i class = "fa fa-paint-pinsel custom"> </ i> | |
| <i class = "fa fa-paper-plane custom"> </ i> | |
| <i class = "fa fa-paper-plane-o custom"> </ i> | |
| <i class = "fa fa-paw custom"> </ i> | |
| <i class = "fa fa-penle custom"> </ i> | |
| <i class = "fa fa-Bleistift-Quadrat Brauch"> </ i> | |
| <i class = "fa fa-Bleistift-Quadrat-o Brauch"> </ i> | |
| <i class = "fa fa-phone custom"> </ i> | |
| <i class = "fa fa-phone custom"> </ i> | |
| <i class = "fa fa-photo custom"> </ i> | |
| <i class = "fa fa-picture-o custom"> </ i> | |
| <i class = "fa fa-pie-chart custom"> </ i> | |
| <i class = "fa fa-plane custom"> </ i> | |
| <i class = "fa fa-volume-up custom"> </ i> | |
| <i class = "fa fa-plus custom"> </ i> | |
| <i class = "fa fa-plus-circle custom"> </ i> | |
| <i class = "fa fa-plus-square custom"> </ i> | |
| <i class = "fa fa-plus-square-o custom"> </ i> | |
| <i class = "fa fa-power-off custom"> </ i> | |
| <i class = "fa fa-print custom"> </ i> | |
| <i class = "fa fa-Puzzleteil benutzerdefiniert"> </ i> | |
| <i class = "fa fa-qrcode custom"> </ i> | |
| <i class = "fa fa-question custom"> </ i> | |
| <i class = "fa fa-question-circle custom"> </ i> | |
| <i class = "fa fa-quote-left custom"> </ i> | |
| <i class = "fa fa-quote-right custom"> </ i> | |
| <i class = "fa fa-random custom"> </ i> | |
| <i class = "fa fa-recycle custom"> </ i> | |
| <i class = "fa fa-refresh custom"> </ i> | |
| <i class = "fa fa-registrierter Brauch"> </ i> | |
| <i class = "fa fa-custom entfernen"> </ i> | |
| <i class = "fa fa-reorder custom"> </ i> | |
| <i class = "fa fa-reply custom"> </ i> | |
| <i class = "fa fa-reply-all custom"> </ i> | |
| <i class = "fa fa-retweet custom"> </ i> | |
| <i class = "fa fa-road custom"> </ i> | |
| <i class = "fa fa-anchor custom"> </ i> | |
| <i class = "fa fa-rss custom"> </ i> | |
| <i class = "fa fa-rss-square custom"> </ i> | |
| <i class = "fa fa-search custom"> </ i> | |
| <i class = "fa fa-search-minus custom"> </ i> | |
| <i class = "fa fa-search-plus custom"> </ i> | |
| <i class = "fa fa-send custom"> </ i> | |
| <i class = "fa fa-send-o custom"> </ i> | |
| <i class = "fa fa-server custom"> </ i> | |
| <i class = "fa fa-share custom"> </ i> | |
| <i class = "fa fa-share-alt custom"> </ i> | |
| <i class = "fa fa-share-alt-square custom"> </ i> | |
| <i class = "fa fa-share-alt-o custom"> </ i> | |
| <i class = "fa fa-schild benutzerdefiniert"> </ i> | |
| <i class = "fa fa-ship custom"> </ i> | |
| <i class = "fa fa-Warenkorb benutzerdefiniert"> </ i> | |
| <i class = "fa fa-sign-in custom"> </ i> | |
| <i class = "fa fa-abmelden benutzerdefiniert"> </ i> | |
| <i class = "fa fa-signal custom"> </ i> | |
| <i class = "fa fa-sitemap custom"> </ i> | |
| <i class = "fa fa-sliders custom"> </ i> | |
| <i class = "fa fa-smile-o custom"> </ i> | |
| <i class = "fa fa-warning custom"> </ i> | |
| <i class = "fa fa-sort custom"> </ i> | |
| <i class = "fa fa-sort-alpha-asc custom"> </ i> | |
| <i class = "fa fa-sort-alpha-desc custom"> </ i> | |
| <i class = "fa fa-sort-asc custom"> </ i> | |
| <i class = "fa fa-sort-desc custom"> </ i> | |
| <i class = "fa fa-sort-down custom"> </ i> | |
| <i class = "fa fa-sort-numeric-asc custom"> </ i> | |
| <i class = "fa fa-sort-numeric-desc custom"> </ i> | |
| <i class = "fa fa-sort-up custom"> </ i> | |
| <i class = "fa fa-space-shuttle custom"> </ i> | |
| <i class = "fa fa-spinner custom"> </ i> | |
| <i class = "fa fa-löffel custom"> </ i> | |
| <i class = "fa fa-square custom"> </ i> | |
| <i class = "fa fa-square-o custom"> </ i> | |
| <i class = "fa fa-star custom"> </ i> | |
| <i class = "fa fa-star-half custom"> </ i> | |
| <i class = "fa fa-star-half-empty custom"> </ i> | |
| <i class = "fa fa-star-halb-voll benutzerdefiniert"> </ i> | |
| <i class = "fa fa-star-half-o custom"> </ i> | |
| <i class = "fa fa-star-o custom"> </ i> | |
| <i class = "fa fa-Haftnotiz"> </ i> | |
| <i class = "fa fa-sticky-note-o custom"> </ i> | |
| <i class = "fa fa-street-view custom"> </ i> | |
| <i class = "fa fa-Koffer benutzerdefiniert"> </ i> | |
| <i class = "fa fa-sun-o custom"> </ i> | |
| <i class = "fa fa-support custom"> </ i> | |
| <i class = "fa fa-tablet custom"> </ i> | |
| <i class = "fa fa-tachometer custom"> </ i> | |
| <i class = "fa fa-tag custom"> </ i> | |
| <i class = "fa fa-tags custom"> </ i> | |
| <i class = "fa fa -asks custom"> </ i> | |
| <i class = "fa fa-tax custom"> </ i> | |
| <i class = "fa fa -elevision custom"> </ i> | |
| <i class = "fa fa-terminal custom"> </ i> | |
| <i class = "fa fa-thumb-stack custom"> </ i> | |
| <i class = "fa fa-thumbs-down custom"> </ i> | |
| <i class = "fa fa-ticket custom"> </ i> | |
| <i class = "fa fa-times custom"> </ i> | |
| <i class = "fa fa-times-circle custom"> </ i> | |
| <i class = "fa fa-times-circle-o custom"> </ i> | |
| <i class = "fa fa-tint custom"> </ i> | |
| <i class = "fa fa-toggle-down custom"> </ i> | |
| <i class = "fa fa-toggle-left custom"> </ i> | |
| <i class = "fa fa-toggle-off custom"> </ i> | |
| <i class = "fa fa-toggle-on custom"> </ i> | |
| <i class = "fa fa-toggle-right custom"> </ i> | |
| <i class = "fa fa-toggle-up custom"> </ i> | |
| <i class = "fa fa-brandmark custom"> </ i> | |
| <i class = "fa fa-tras custom"> </ i> | |
| <i class = "fa fa-trash-o custom"> </ i> | |
| <i class = "fa fa-tree custom"> </ i> | |
| <i class = "fa fa-trophy custom"> </ i> | |
| <i class = "fa fa-Truck custom"> </ i> | |
| <i class = "fa fa-rollstuhl custom"> </ i> | |
| <i class = "fa fa-tv custom"> </ i> | |
| <i class = "fa fa-umbrella custom"> </ i> | |
| <i class = "fa fa-university custom"> </ i> | |
| <i class = "fa fa-custom benutzerdefinieren"> </ i> | |
| <i class = "fa fa-refresh-alt custom"> </ i> | |
| <i class = "fa fa-unsortierte benutzerdefinierte"> </ i> | |
| <i class = "fa fa-upload custom"> </ i> | |
| <i class = "fa fa-user custom"> </ i> | |
| <i class = "fa fa-user-plus custom"> </ i> | |
| <i class = "fa fa-user-secret custom"> </ i> | |
| <i class = "fa fa-user-times custom"> </ i> |