阿里矢量圖標(biāo)怎么使用？當(dāng)我們需要使用一些矢量圖標(biāo)“img”文件的話該如何進(jìn)行使用呢？本文中winwin7小編給大家分享介紹下阿里矢量圖標(biāo)使用方法，有需要的用戶快來(lái)試試吧！


 

阿里矢量圖標(biāo)使用方法

1、首先選擇去圖標(biāo)庫(kù)自行選擇想要的圖標(biāo)；



2、選擇圖標(biāo)，點(diǎn)擊圖標(biāo)變成橘色，即放在暫存架；



3、選擇好要用的圖標(biāo)后，點(diǎn)擊暫存架的下載至本地，解壓待用；



4、將下載完的文件解壓后，放到某一文件夾中，右鍵打開demo_unicode.html文件；



5、把上述文件中的代碼復(fù)制到自己的項(xiàng)目中：

  @font-face {font-family: "iconfont";
          src: url('iconfont.eot'); /* IE9*/
          src: url('iconfont.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
          url('iconfont.woff') format('woff'), /* chrome, firefox */
          url('iconfont.ttf') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
          url('iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
        }
 
        .iconfont {
          font-family:"iconfont" !important;
          font-size:16px;
          font-style:normal;
          -webkit-font-smoothing: antialiased;
          -webkit-text-stroke-width: 0.2px;
          -moz-osx-font-smoothing: grayscale;
        }

上面i標(biāo)簽中的class值就是上面樣式中的class！

關(guān)于阿里矢量圖標(biāo)使用方法就給大家介紹到這里，有需要的用戶快來(lái)試試吧！