代码
<!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="./iconfont/iconfont.css"> <style> div { width: 200px; margin: 0 auto; } * { margin: 0; padding: 0; } ul li { list-style: none; } a { text-decoration: none; color: black; } .orange { color: #f40; } </style> </head> <body> <div> <ul> <li> <a href="#" class="iconfont icon-cart-Empty-fill orange"></a> <a href="#">购物车</a> <a href="#" class="iconfont icon-arrow-down"></a> </li> </ul> </div> </body> </html>
步骤
- 将iconfont文件夹引入到项目中
- 引入link文件(要注意最后面的是iocnfont.css文件)
<link rel="stylesheet" href="./iconfont/iconfont.css">
3.写两个类名，第一个必须写iconfont 第二个类名根据自己的需求来写(从网站上找)
成果
