当前位置：网站首页>Icon Font

Icon Font

2022-07-27 13:22:00 【Sorry, this person doesn't exist】

Icon Font 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="/font/css/all.css">
    <style> li{
      list-style: none; } li::before{
      /*  Set the icon font through pseudo elements  1. Find the element to set the icon through before or after Choose  2. stay content Set the font encoding in  3. Set the font style  fab font-family：'Font Awesome 5 Brands'; fas font-family:'Font Awesome 5 Free'; font-weight:900; */ content: '\f1b0'; font-family: 'Font Awesome 5 Free'; font-weight: 900; color: blue; margin-right: 10px; } </style>
</head>
<body>
    <!--  Icon Font （iconfont） - Icons are often used in web pages , Icons can be introduced through pictures   But the size of the picture itself is large , And very inflexible  - So when using icons , We can also set the icon directly to the font ,  Then, after that font-face To introduce fonts in the form of  - In this way, we can use icons in the form of fonts  font awesome Use steps  1. download   Download from the official English website  2. decompression  3. take css and webfonts Move to project  4. take all.css Introduce into web pages  5. Use icon Fonts  - Use the icon font directly through the class name  class="fas fa-bell" class="fab fa-accessible-icon" -->
     <!-- <i class="fas fa-bell"></i> -->
     <ul>
         <li>
              Hoe standing grain gradually pawning a midday 
         </li>
     <li>...</li>
     </ul>
     <!--  Using icon fonts through entities ： &#x Code of icon ; -->
      <span class="fas">&#xf0f3;</span>
</body>
</html>
原网站

版权声明
本文为[Sorry, this person doesn't exist]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/208/202207271110149236.html

边栏推荐

猜你喜欢

随机推荐