font awesome矢量字体的使用

 官网地址:http://www.fontawesome.com.cn/faicons/

设置字体图标大小

 awesome 是一种字体,控制图标的大小,是通过 font-size 来实现的,before 字体大小 font-size 继承父亲。找到对应的元素,修改 font-size 就可以实现控制图标大小了。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      .fa-car {
        color: pink;
      }
      .box {
        font-size: 50px;
      }
    </style>
    <link
      rel="stylesheet"
      href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css"
    />
  </head>
  <body>
    <div class="box">
      <i class="fa fa-car"></i>
    </div>
  </body>
</html>

效果

猜你喜欢

转载自blog.csdn.net/m0_69502730/article/details/128611165