zoukankan      html  css  js  c++  java
  • 网页使用特殊字体

    为了设计需要,页面加不常见字体。

    ----------------------------------------------

    情景 一、

    网站上使用了特殊字体

    1、注册一个有字库帐号,登录后上传自己的字体,或者使用开源字体,点击使用,你会看到怎么用

    感谢有字库的免费服务, 赠送了10万库币,用完就得充值啦

    2、在需要使用字体的页面添加JS
    第一步:JS调用 (本JS支持https,只需要将src属性中的http改为https即可)
    将以下代码添加到您网页的:<head>标签之中
    <script type="text/javascript" src="http://cdn.webfont.youziku.com/wwwroot/js/wf/youziku.api.min.js"></script>
    第二步:设置标签
    将以下代码添加到您网页的:</body>标签之前,紧挨着</body>
    <script type="text/javascript">
    $youziku.load("body", "1c61872e424a48d0ba9d16f97dbbc240", "jdzhonyuanjian");
    /*$youziku.load("#id1,.class1,h1", "1c61872e424a48d0ba9d16f97dbbc240", "jdzhonyuanjian");*/
    /*...*/
    $youziku.draw();
    </script>

    情景 二、

    本地静态HTML页面使用特殊字体,不用考虑加载速度,字体直接拷进去用

    1、字体客http://www.fontke.com/上传ttf文件,生成字体各种文件,拷贝到网页目录里

    2、CSS里这样写

    /*----------------字体 开始-----------------*/
    @font-face{ 
    font-family:'FZLTZHUNHK'; 
    src:url('font/FZLTZHUNHK.eot'); /* IE9 Compat Modes */
    src:url('font/FZLTZHUNHK.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
    url('font/FZLTZHUNHK.woff') format('woff'), /* Modern Browsers */ 
    url('font/FZLTZHUNHK.ttf') format('truetype'), /* Safari, Android, iOS */
    url('font/FZLTZHUNHK.svg#FZLTZHUNHK') format('svg'); /* Legacy iOS */ 
    font-weight:normal; 
    font-style:normal;*
    } 
    .thumbnail_text,h2,h3,h4,a,p{ font-family:'FZLTZHUNHK';} 
    /*----------------字体 结束-----------------*/

    页面里对应元素就可以看到效果啦

  • 相关阅读:
    Java线程同步synchronized的理解
    MySQL基础操作(二)
    MySQL基础操作(一)
    MySQL备份--xtrabackup与mysqldump工具使用
    MySQL主从复制以及在本地环境搭建
    生活在长大——第一次冲刺小任务
    现代软件工程之敏捷开发
    入门github
    我的编程人生
    Java线程
  • 原文地址:https://www.cnblogs.com/LLLLoveLLLLife/p/6812857.html
Copyright © 2011-2022 走看看