iconfont图标字体的介绍与使用

最新推荐文章于 2024-08-08 10:13:45 发布

杏黄的三叶草

最新推荐文章于 2024-08-08 10:13:45 发布

阅读量798

点赞数

分类专栏： Web前端CSS

本文链接：https://blog.csdn.net/dwjdj/article/details/104098440

版权

本文介绍了如何使用iconfont，包括font-class和unicode两种引用方式。首先，你需要在iconfont.cn网站上选择并下载所需的图标，然后参照demo说明进行配置和应用。

摘要由CSDN通过智能技术生成

font-class引用

先去iconfont.cn网站下载你所需要的图标，然后看demo说明

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>IconFont</title>
    <link rel="stylesheet" href="demo.css">
    <link rel="stylesheet" href="iconfont.css">
</head>
<body>
<div class="main markdown">
    <h1>IconFont 图标</h1>
    <ul class="icon_lists clear">

        <li>
            <i class="icon iconfont icon-fenxiang"></i>
            <div class="name">分享</div>
            <div class="fontclass">.icon-fenxiang</div>
        </li>

        <li>
            <i class="icon iconfont icon-fanhui"></i>
            <div class="name">返回