在Firefox和IE中遇到字体系列css属性的问题

时间:2015-10-22 17:57:32

标签: html css3 google-chrome firefox

字体系列的css属性没有在firefox中执行,但在chrome中是完美的。

在firefox和chrome Firefox element inspector

中附加元素检查器的屏幕截图

Chrome element inspector

body {
  background: #fefefe;
  color: #777;
  font-family: 'Roboto' sans-serif !important;
  font-size: 16px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

2 个答案:

答案 0 :(得分:1)

Helvetica不是标准的网络安全字体,请尝试使用

//fix lateral filter and gallery on scrolling
$(window).on('scroll', function(){
    fixGallery();
});

function fixGallery() {
    var offsetTop = $('.cd-main-content').offset().top,
        scrollTop = $(window).scrollTop(),
        headerHeight = $('.main-header').height();
    ( scrollTop + headerHeight >= offsetTop ) ? $('.cd-main-content').addClass('is-fixed') : $('.cd-main-content').removeClass('is-fixed');
}

您也可以下载该字体并进行链接。

或者尝试使用类似的字体形式googlefonts https://www.google.com/fonts/specimen/Open+Sans+Condensed

答案 1 :(得分:1)

font-family值应该以逗号分隔。某些浏览器将您的字体系列名称解释为“'Roboto'sans-serif”并非不可能。