挿入HTMLアイコンにIcoMoon使用

サイトのHTMLページの作成、または何か他のものでは、我々はディスプレイにいくつかの造園のアイコンを使用する必要があります
例えば:

実装手順

まず、icomoonダウンロードアイコンを入力してください

https://icomoon.io/app/#/select

1、必要なアイコンを選択します

2.をクリックしてフォントを生成します

3、ダウンロードをクリックしてください

図4に示すように、抽出iconmoon.zip

ダウンロードが取得するために完了したらicomoon.zip、ファイル
アンパックicomoonフォルダ
以下のように内容を

第二に、プロジェクトへの展開

ここではプロジェクトディレクトリにすべてのファイルをコピーします。

第三に、例の使用

私の新しいdemo01.html Aケーススタディで

1、新しいdemo01.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>demo01</title>
</head>
<body>

</body>
</html>

2、インポートCSSファイル

<link type="text/css" rel="stylesheet" href="source/font/style.css">

3、アイコンのコードを参照してください

私たちは、アイコンを選択し生成した後のWebページには、アイコンコードを表示することができます
クリックしてget code

ビューの使用状況やアイコンコードへの

プロジェクトディレクトリにコピーし、前に出て抽出することができますstyle.css導入されたアイコン表示で

使用するCSSへのアイコンのスタイルのフォーマット美化することができ、ここで*

4、htmlの中にアイコンを追加

<span class="icon-home2"></span>

5、ディスプレイ

公開された35元の記事 ウォンの賞賛1 ビュー1843

おすすめ

転載: blog.csdn.net/qq_40672635/article/details/104746781