zoukankan      html  css  js  c++  java
  • css外部字体库文件的引用

    最近在做项目的时候,需要显示类似钟表的数字字体,做完之后记录一下:

    1、下载字体库文件

      自己去网上下载你想用的css字体库,这个就根据需求自己下载了。

      我自己项目中的之这个样子的(DS-Digital文件夹是我下载的字体库):

      

      我是放在css目录下,你可以自己按照自己的意愿放到其他地方。

    2、在css中引用

      在我自己新建的serviceHall.css中引用

      

    1 @font-face {
    2     font-family: electronicFont;
    3     src: url(../css/DS-Digital/DS-DIGIT.ttf), url(../css/DS-Digital/DS-DIGII.ttf), url(../css/DS-Digital/DS-DIGIB.ttf), url(../css/DS-Digital/DS-DIGI.ttf)
    4 }

      font-family的值可以自己定义。根据你的字体库路径引入字体文件。

    3、引用我们自己引入的样式

      跟平时写样式那样,比如

     1 .servicehall-today-tablelist-wait{
     2     width: 25%;
     3     font-size: 20px;
     4     text-align: center;
     5     padding: 8px 2px;
     6     line-height: 24px;
     7     vertical-align: top;
     8     overflow: hidden;
     9     text-overflow: ellipsis;
    10     white-space: nowrap;
    11 
    12     font-family: electronicFont;
    13 }

      这样就OK了,就是这么简单。效果图(数字字体部分是我引入的字体):

      

  • 相关阅读:
    【HDOJ】2267 How Many People Can Survive
    【HDOJ】2268 How To Use The Car
    【HDOJ】2266 How Many Equations Can You Find
    【POJ】2278 DNA Sequence
    【ZOJ】3430 Detect the Virus
    【HDOJ】2896 病毒侵袭
    求奇数的乘积
    平方和与立方和
    求数列的和
    水仙花数
  • 原文地址:https://www.cnblogs.com/webgis-ling/p/11465167.html
Copyright © 2011-2022 走看看