Less 要应用语义原则，请使用令人敬畏的字体和更少的字体？

我正试图以与Bootstrap相同的方式使用Font-awesome，符合web设计的语义原则（不在HTML标记中放入数十亿个非语义类），使用更少的资源

似乎这是不可能的：图标定义如下：

.@{fa-css-prefix}-home:before { content: @fa-var-home; }

这不是一个mixin定义，而是一个具有较少变量的经典CSS规则构建

所以，我不能做这种声明：

.meaning-class-name {
    .fa-home;
}

Lessc抱怨

.fa home

未定义

这是一种避免破坏HTML代码的方法吗？有没有一种方法可以将一个类的属性赋予另一个具有较少属性的类

---

谢谢

我发现更好的解决方案是修改

font-awesome/less/icons.less

并根据以下模式重写声明：

.@{fa-css-prefix}-home { &:before { content: @fa-var-home; } }

它类似于引导使用的

字形图标

PS：在Eclipse中，这可以通过查找/替换工具快速完成：

查找：

\.@\{fa-css-prefix\}-([-0-9a-zA-Z]+):before \{ content: @([-0-9a-zA-Z]+); \}

\.@\{fa-css-prefix\}-([-0-9a-zA-Z]+):before,

替换：

.@{fa-css-prefix}-$1 { &:before { content: @$2; } }

.@{fa-css-prefix}-$1,

及

查找：

\.@\{fa-css-prefix\}-([-0-9a-zA-Z]+):before \{ content: @([-0-9a-zA-Z]+); \}

\.@\{fa-css-prefix\}-([-0-9a-zA-Z]+):before,

替换：

.@{fa-css-prefix}-$1 { &:before { content: @$2; } }

.@{fa-css-prefix}-$1,

请参阅，可能的副本会起作用，但是对于每个新的FA版本，您都需要这样做。因此，顺便说一句，从技术上讲，创建我们自己的mixin，而不修改任何FA源更容易。mixin很简单（一个mixin代表所有图标）。您的解决方案也很好，但有时，
@fa-var-something
变量与faont-awesome类不完全匹配。示例：
.fa条形图
指向
@fa-var-bar-chat-o
变量。你的解决方案阻止了仅仅阅读字体描述网页来编写你的定义。我在GitHub中做了一个拉取请求。也许我的修改会被接受并整合到官方版本中。。。