>  기사  >  웹 프론트엔드  >  @font-face 客户端使用用服务器端字体样式 字体转换工具_html/css_WEB-ITnose

@font-face 客户端使用用服务器端字体样式 字体转换工具_html/css_WEB-ITnose

WBOY
WBOY원래의
2016-06-24 11:45:221379검색

网站部署到服务器后,在css中设置好了字体,但是在客户那边显示的却是宋体或其他的默认安全字体,这是因为客户端没有相应的字体库导致的。

要想客户端成功显示服务器端的字体的话,可以使用CSS样式@font-face{}来实现。

具体的实现方法请看代码:

@font-face {
  font-family:'锐字云水柱体';
  src:url('锐字云水柱体.eot');
  src: url('锐字云水柱体.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('锐字云水柱体.woff') format('woff'), /* Modern Browsers */
    url('锐字云水柱体.ttf') format('truetype'), /* Safari, Android, iOS */
    url('锐字云水柱体.svg#锐字云水柱体') format('svg'); /* Legacy iOS */
}

 

这样的话客户端打开相关网页就会自动加载字体样式,这里要注意一点,要加载的字体样式不能太大了,不然的话会加载很长时间,并有一定几率加载失败,所以最好字体库不要大于10M。

加载的字体使用的话跟正常情况下使用一致。

TTF转EOT工具下载   访问密码:21ce

相关资料

http://www.php100.com/manual/css3_0/@font-face.shtml

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.