小编Mec*_*isM的帖子

通常的做法是使用CDN缓存javascript,css,font等等...但是这似乎并没有扩展到图标到相同的程度(可能因为每个网站都喜欢具有独特的外观和感觉？)

是否有广泛使用的CDN托管的图标集,这些图标集通常足以从CDN托管中提供显着的速度提升,并且可能已经使用该CDN从另一个站点预先缓存.

一个例子是:http: //cdnjs.cloudflare.com,其内容可浏览https://github.com/cdnjs/cdnjs/tree/master

它主机所在的一些图标集:

/ajax/libs/twitter-bootstrap/2.3.2/img/glyphicons-halflings.png
/ajax/libs/fatcow-icons/...
/ajax/libs/foundicons/3.0.0/svgs/...
/ajax/libs/aui/5.4.0/aui/css/icons/...
/ajax/libs/topcoat-icons/0.2.0/svg/...
/ajax/libs/jqueryui/1.10.3/css/base/images/...
*jqueryui is also hosted on ajax.googleapis.com and others but is a limited set

和bootstrap halflings图标集一样:

http://netdna.bootstrapcdn.com/bootswatch/2.3.2/img/glyphicons-halflings.png
http://ajax.aspnetcdn.com/ajax/bootstrap/2.3.2/img/glyphicons-halflings.png
http://www.bootstrapcdn.com/twitter-bootstrap/2.3.1/img/glyphicons-halflings.png

我想创建只包含图标的特殊字体.并且对于每个字母将是不同的图标.我想在css中嵌入这个字体.如果我需要一些图标,请使用这样的:

<a class="icon">f</a>

和css

<link href='http://fonts.mysite.com/css?family=MyFontWithIcons' rel='stylesheet' type='text/css'>

其中包含:

@media screen {
@font-face {
  font-family: 'MyFontWithIcons';
  font-style: normal;
  font-weight: normal;
  src: local('MyFontWithIcons'), url('http://fonts.mysite.com/font?MyFontWithIcons') format('truetype');
}
}

并显示带有图标类的图标:

.icon {font-family: 'MyFontWithIcons'; }

字母"f"将替换为位于f字母位置的字体内的图标.和css一起使用字体并用字体内的图标替换f.我认为这是好主意吗？字体文件的大小比许多图像图标小.而且这种技术我可以使用不同的字体颜色=不同的图标颜色？尺寸等.那么,这是好主意还是不好？