Блог

http://ocw.mit.edu/courses/mathematics/18-06sc-linear-algebra-fall-2011/download-course-materials / попробуйте загрузить курс по этой ссылке.

из папки zip когда я просматриваю страницы в автономном режиме в Firefox, шрифты отображаются некорректно, вы можете сравнить его с chrome и IE, открыв курс в автономном режиме в обоих браузерах.

Я попытался использовать local() в @font-face src: но это не повлияло, не могу использовать опцию .htaccess, поскольку курс будет доступен в автономном режиме после загрузки, и, возможно, нет необходимости устанавливать apache на машинах.

Я попытался изменить fileURI в about:config firefox, это сработало, но это не идеальное решение, так как пользователей много, и они не могут этого сделать. Пожалуйста, предложите какое-нибудь решение.

код для base.css:

      @font-face {
 font-family: TitilliumText22LLight;
     src: local("TitilliumText22LLight"), url('../webfonts/TitilliumText22L002- webfont.eot');
     src: local("TitilliumText22LLight"), url('../webfonts/TitilliumText22L002-webfont.eot?#iefix') format("embedded-opentype"),
 url('../webfonts/TitilliumText22L002-webfont.otf') format("otf"),
     url('../webfonts/TitilliumText22L002-webfont.woff') format("woff"),
     url('../webfonts/TitilliumText22L002-webfont.ttf') format("truetype"),
     url('../webfonts/TitilliumText22L002-webfont.svg#TitilliumText22LLight') format("svg");
     font-weight: normal;
     font-style: normal;
     }


     @font-face {
 font-family: TitilliumText22LRegular;      /* Titillium Regular */
     src: local("TitilliumText22LRegular"), url('../webfonts/TitilliumText22L003-webfont.eot');
     src: local("TitilliumText22LRegular"), url('../webfonts/TitilliumText22L003-webfont.eot?#iefix') format("embedded-opentype"),
 url('../webfonts/TitilliumText22L002-webfont.otf') format("otf"),
     url('../webfonts/TitilliumText22L003-webfont.woff') format("woff"),
     url('../webfonts/TitilliumText22L003-webfont.ttf') format("truetype"),
     url('../webfonts/TitilliumText22L003-webfont.svg#TitilliumText22LRegular') format("svg");
     font-weight: normal;
     font-style: normal;
     }

     @font-face {
 font-family: TitilliumText22LBold;     /* Titillium Bold */
     src: local("TitilliumText22LBold"), url('../webfonts/TitilliumText22L005-webfont.eot');
     src: local("TitilliumText22LBold"), url('../webfonts/TitilliumText22L005-webfont.eot?#iefix') format("embedded-opentype"),
 url('../webfonts/TitilliumText22L005-webfont.otf') format("otf"),
     url('../webfonts/TitilliumText22L005-webfont.woff') format("woff"),
     url('../webfonts/TitilliumText22L005-webfont.ttf') format("truetype"),
     url('../webfonts/TitilliumText22L005-webfont.svg#TitilliumText22LBold') format("svg");
     font-weight: bold;
     font-style: normal;
     }`
  

код для Courses_new.css :

     #course_nav li a,
    #course_nav li a:visited {
font-family: TitilliumText22LBold, Verdana;
color: #666;
font-size: 1.2em;
text-decoration: none;
text-transform: uppercase;
margin: inherit;
padding: inherit;
width: 125px;
    }
  

в приведенном выше сценарии course_new.css вызывает класс TitilliumText22LBold из base.css, но он не применяется к тексту в автономном режиме, который вы можете увидеть на левой панели навигации при открытии страницы из zip.

Когда я удаляю verdana, он применяет Titillium text22lbold, но шрифты по-прежнему отличаются от шрифтов в онлайн-режиме.

Пожалуйста, предложите, что нужно сделать дальше, чтобы этот шрифт также применялся в автономном режиме.

Я сам использовал пользовательские шрифты. Мой код работал с обеих сторон, как в автономном, так и в автономном режиме. Это правило CSS, которое я добавил в первые строки моего файла css:

 @font-face { font-family: BebasNeue; src: url('../fonts/BebasNeue.otf'); } 
  

А затем я просто назвал их в своем css следующим образом:

 h1 {
    font-family: BebasNeue;
}
  

Я надеюсь, что это поможет.

И я советую вам использовать файлы .otf! Я узнал, что файлы TTF не будут загружаться локально. это также может быть вашей проблемой 🙂