1. Preparations
Log in to the Ali iconfont website, select the icon library, add to the shopping cart, and add to the project.
2. Import method
2.1 Download to the local, import the css in the downloaded file into the corresponding html file
<link rel="stylesheet" href="./fonts/iconfont.css">2.2 Generate an online link directly on the iconfont website, copy and use the link to import, remember to add http:
<link rel="stylesheet" href="http:复制的链接">3. Use
3.1 Call by class name
<span class="iconfont icon-daohangdizhi"></span>Among them, span can be replaced with <i></i> or <em></em> Among them, iconfont in class is a fixed usage, because iconfont has a preset style in the imported css, and the second is a specific class name, namely The icon class name you want to call.
3.2 Call using unicode
<i class="iconfont"></i>The same label can be double-labeled at will, but iconfont needs to be added to the class name, and the content directly writes the unicode value of the corresponding font icon. You can go to iconfont.css/demo.html/ Ali homepage project library to find the value directly
3.3 Pseudo-element call
HTML
<div class="iconfont car">购物车</div>
CSS
.car::before {
content: "\e63b";
}
.car::after {
content: "\e686";