css教程

Font Awesome图标库使用方法和CDN公共库分享

我的站长站 2024-10-10 人阅读

Font Awesome使用方法

Font Awesome使用前缀 fa 和图标的名称来放置 Font Awesome 图标,可缩放、定制大小、颜色、阴影等等,都可以用CSS的样式修改。

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
</head>
<body>
 
<i class="fa fa-car"></i>
<i class="fa fa-car" style="font-size:48px;"></i>
<i class="fa fa-car" style="font-size:60px;color:red;"></i>
 
</body>
</html>

Font Awesome CDN公共库

国内推荐 CDN:

<link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">

海外推荐 CDN

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">


相关推荐
  • 图标库
  • Font Awesome图标库使用方法和CDN公共库分享

    Font Awesome使用方法Font Awesome使用前缀 fa 和图标的名称来放置 Font Awesome 图标,可缩放、定制大小、颜色、阴影等等,都可以用CSS的样式修改。<!DOCTYPE html><html><head><link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome...

    css教程 9 1个月前
  • Iconfont图标库Android/IOS使用方法

    阿里巴巴图标超详细使用方法可以看下面这篇教程,本篇我的站长站主要分享阿里巴巴图标在Android和IOS上的使用方法。[xxid]30,1818[/xxid]Android使用方法1、下载iconfont字体图标2、复制字体文件到项目 assets 目录3、打开 iconfont 目录中的 demo.ht...

    经验分享 281 4年前
  • 阿里巴巴IconFont矢量字体图标库在线工具
    阿里巴巴IconFont矢量字体图标库在线工具

    搞前端开发、UI设计的应该都知道这款阿里巴巴IconFont矢量字体图标库在线工具,是国产最大的矢量字体图标库了。而且使用非常人性方便,网站没有多余的内容,打开搜索即可找到自己需要的内容。使用方法...

    在线工具 893 4年前
最新更新