layui 的所有图标全部采用字体形式，取材于阿里巴巴矢量图标库（iconfont）。因此你可以把一个 icon 看作是一个普通的文字，这意味着你直接用 css 控制文字属性，如 color、font-size，就可以改变图标的颜色和大小。你可以通过 font-class 或 unicode 来定义不同的图标。
学习链接：Layui字体图标
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>HelloWorld</title> 6 <style type="text/css"> 7 .b{ 8 background-color:pink; 9 } 10 .b2{ 11 background-color: green; 12 } 13 </style> 14 </head> 15 <link rel="stylesheet" href="/LayuiTest/layui/css/layui.css"> 16 <body style="padding: 50px"> 17 <i class="layui-icon layui-icon-face-smile"></i> 18 <i class="layui-icon layui-icon-home" style="font-size: 30px; color: #1E9FFF;"></i> 19 <script src="/LayuiTest/layui/layui.js"></script> 20 </body> 21 </html>
原文：https://www.cnblogs.com/zyxsblogs/p/9785803.html