css - 如何使用css2从服务器加载字体系列

Question

我想使用 css2 从服务器加载字体。我想在服务器上保留字体。我不想使用 CSS3，因为并非所有浏览器都支持它，所以我该如何使用 css2 来做到这一点？

@font-face

Answer 1

<style type="text/css">
@font-face {
    font-family: 'lucida_sans_unicoderegular';
    src: url('font/lsansuni-webfont.eot');
    src: url('font/lsansuni-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/lsansuni-webfont.woff') format('woff'),
         url('font/lsansuni-webfont.ttf') format('truetype'),
         url('font/lsansuni-webfont.svg#lucida_sans_unicoderegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
#menu {
    font-family: 'lucida_sans_unicoderegular',Times New Roman, Times, serif;
}
</style>

lsansuni-webfont.eot ,lsansuni-webfont.wof,.. 将此文件放在字体文件夹中

使用此生成器创建 @fontface

http://www.fontsquirrel.com/fontface/generator

Answer 2

它是什么？

@font-face是一个 css 规则，如果用户没有安装该字体，它允许您从服务器下载特定字体以呈现网页。这意味着网页设计师将不再需要遵守用户预先安装在其计算机上的一组特定的“网络安全”字体。

如何使用：

句法

@font-face {
  font-family: <a-remote-font-name>;
  src: <source> [,<source>]*;
  [font-weight: <weight>];
  [font-style: <style>];
}

例子

@font-face {
  font-family: MyHelvetica;
  src: local("Helvetica Neue Bold"),
  local("HelveticaNeue-Bold"),
  url(MgOpenModernaBold.ttf);
  font-weight: bold;
}

兼容性：

IE 6、7、8、9、10、Firefox、Chrome 都支持它。