我結束了工作。有幾個方法可以做到這兩者非常相似:
選擇一個
編輯現有@mixin fa-icon()
通過添加參數進去例如,它應該是這樣的:
@mixin fa-icon($icon) {
display: inline-block;
font: normal normal normal #{$fa-font-size-base}/1 FontAwesome; // shortening font declaration
font-size: inherit; // can't have font-size inherit on line above, so need to override
text-rendering: auto; // optimizelegibility throws things off #1094
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
transform: translate(0, 0); // ensures no half-pixel rendering in firefox
@extend .fa;
@extend .fa-#{$icon};
}
用法:
.class-name {
@include fa-icon(facebook);
font-size: 50px;
}
選項2:
使用這個定製的mixin:http://genesy.me/font-awesome-mixin/
已經有一個線程,可以幫助你:http://stackoverflow.com/questions/18179098/how-to-use-font-awesome-in-own-css –
這不是很想我是如何ab爲了做到這一點,我希望能夠使用mixin。通過它的外觀,我可能不得不使用自定義混合,因爲它看起來不像我可以做到這一點默認情況下 – ifusion