This article is a mirror article of machine translation, please click here to jump to the original article.

Architect_Programmer_Code Agriculture Network»Architect › Front-end design & web › Front-end frame › Angular 6 introduces the Font Awesome icon tutorial
View: 25649|Reply: 2

[Angular] Angular 6 introduces the Font Awesome icon tutorial

[Copy link]
Posted on 5/13/2019 3:29:22 PM | | | |
Font Awesome is a great library of font icons for web pages that offer scalable vector icons that can be customized in size, color, shadow, and any style that can be styled with CSS.

First of all, the renderings:



Environment:

Angular CLI: 6.2.4
Node: 8.9.2
OS: win32 x64

Tutorial:

npm installation command:

C:\project\git\itsvse>npm install --save font-awesome angular-font-awesome
npm WARN optional SKIPPING OPTIONAL DEPENDENCY:fsevents@1.2.9(node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform forfsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ font-awesome@4.7.0
+ angular-font-awesome@3.1.2
added 69 packages and updated 1 package in 10.117s

Import Module:

Import in the app.module.ts or sub-routing module:

Introducing SCSS stylesheets:

angular.json, decide to introduce a style library based on the CSS syntax used, as follows:

If youNot usedCLI, please import the stylesheet into your index.html file:

(Just ignore it)

Use:


Properties
type
disposition
Optional
name
String
F-A Icons
No
size
String
lg, 2x, 3x, 4x, 5x
Yes
fixed
Boolean
true | false
Yes
animation
String
spin | pulse
Yes
rotate
Number | String
90 | 180 | 270 horizontal | vertical
Yes
inverse
Boolean
true | false
Yes

Font icon search:The hyperlink login is visible.

Resources:The hyperlink login is visible.




Previous:A full set of materials commonly used by HR
Next:HTML 500 Error Page Template

Related Posts
Posted on 8/12/2021 10:12:26 AM |
Thank you, big guy
 Landlord| Posted on 8/7/2024 9:13:14 PM |
The Angular 18 series (twenty-two) introduces the FontAwesome icon library
https://www.itsvse.com/thread-10805-1-1.html
Disclaimer:
All software, programming materials or articles published by Code Farmer Network are only for learning and research purposes; The above content shall not be used for commercial or illegal purposes, otherwise, users shall bear all consequences. The information on this site comes from the Internet, and copyright disputes have nothing to do with this site. You must completely delete the above content from your computer within 24 hours of downloading. If you like the program, please support genuine software, purchase registration, and get better genuine services. If there is any infringement, please contact us by email.
Mail To:help@itsvse.com