每次要用到圖標(biāo)的時(shí)候都會(huì)到 icono 去copypaste，但每次用到的時(shí)候尺寸都各不一樣，總是要調(diào)整參數(shù)，巨煩。當(dāng)然你可以會(huì)想到用zoom、scale來做縮放，但是這樣的縮放會(huì)使得線寬也變粗了，不甚滿意。
終于下定心思來改造一個(gè)可縮放的圖標(biāo)庫(kù)。github先上：https://github.com/qieguo2016/iconoo，目前提供下載link標(biāo)簽引入和npm+webpack的引入方式，詳見項(xiàng)目的readme。（喂，求star！）
關(guān)于改造，一開始的想法就是使用百分比尺寸來改造，然后馬上發(fā)現(xiàn)不可行了，繪制圖標(biāo)最依賴的兩種手段：border、box-shadow都不可以用百分比，所以這個(gè)想法，pass！然后很自然就想到了在單位上做文章，rem？No、No、No，一個(gè)庫(kù)依賴全局變量那簡(jiǎn)直是個(gè)笑話。剩下的自然就是em了，在icon級(jí)設(shè)置font-size，然后icon本身以及后代都以這個(gè)font-size為參照，Perfect！
CSS繪圖的原理
使用CSS繪制線條，用到的不外乎兩個(gè)屬性：border & box-shadow。而形狀則可以用border-radius、transform控制，位置會(huì)用到絕對(duì)定位、transform、margin等。CSS的繪圖，做過幾個(gè)就知道大概是怎么回事了，歸根到底，還是幾何。
比如最簡(jiǎn)單的加號(hào)：
View Code
