How to use font-awesome icons in WeChat applet

Download font-awesome font package
Open the Transfonter website and upload the font fontawesome-webfont.ttf (theoretically other file formats can also be converted, but I have not tried it yet) ), select base64 encoding, convert and download

. There is a style file in the downloaded package. After opening it, you will get the following code, and compare it with the content in font-awesome.css and add it to WeChat

## in the app.wxss file of the mini program c549c9cbbc8476b9bdd69170cb0aa1df

Then use class="fa fa-user" in the mini program, such as

Related labels：

WeChat applet

source：php.cn

Previous article：Create a back to top button Next article：ES6 new features development WeChat applet (3)

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Latest Articles by Author

• Definition and usage examples of mysql execution function mysql_query()
  1970-01-01 08:00:00
• Detailed steps for connecting php to mysql database (pictures and texts)
  1970-01-01 08:00:00
• Graphical tutorial on adding, deleting and modifying sql database (phpMyAdmin usage tutorial)
  1970-01-01 08:00:00
• SQL database import and export step tutorial (picture)
  1970-01-01 08:00:00
• Visual addition, deletion and modification tutorial of sql data table (phpMyAdmin usage tutorial)
  1970-01-01 08:00:00
• Tutorial on adding, deleting, modifying and querying data tables using SQL statements (phpMyAdmin usage tutorial)
  1970-01-01 08:00:00
• Detailed explanation of Java multithreading basics
  1970-01-01 08:00:00
• File upload image in php
  2023-03-06 22:20:01
• A summary of several ways to create objects in JS
  1970-01-01 08:00:00
• Deeply understand the this keyword in JS
  1970-01-01 08:00:00

Latest Issues

How to fix the problem: "Unable to load resource: net::ERR_CONNECTION_REFUSED http://localhost:8989/route?...." There is a problem with my program. This is a program about geographic information systems...

From 2023-11-12 19:34:27

0

1

244

Leverage VueJS components in PHP I want to mix basic HTML generated by Php and VueJS components without having to use VueJS...

From 2023-11-11 00:01:44

0

2

288

Nuxt.js: window is not defined apexcharts/vue-apexcharts I've added this simple example from apexcharts.com. Pretty sure the import is correct. I d...

From 2023-11-09 22:07:08

0

2

217

What are the performance numbers next to components in the Vue dev tools? Does anyone have insights or resources for a certain feature in the Vue development tools?...

From 2023-11-09 14:46:48

0

1

305

Encountering Laravel Mix error while trying to install Laravel Breeze I'm trying to install LaravelBreeze in my new Laravel application. Everything is working f...

From 2023-11-07 23:05:02

0

1

299

Related Topics

More>

• How to create a WeChat clone
• What is the difference between blocking and deleting on WeChat?
• WeChat failed to load data
• What does WeChat clone mean?
• WeChat restore chat history
• How to delete WeChat emoticons
• How to set top text on WeChat
• WeChat steps