2016-10-12 2 views
3

я провел тему на GitHub pages, эта тема работает должным образом в localhost среды, но когда я провести это его не претендует правильный шрифт, который импортируют форму Google APIИмпорт шрифтов API Google не претендуя на страницах GitHub

Разница здесь

Локальный хост-версия

enter image description here

Githhub Page Версия

enter image description here

Это моя Index.html страница

<!doctype html> 
<html lang="en" class="no-js"> 
<head> 
    <meta charset="UTF-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no;"> 
    <title>Sample Name</title> 

    <!--(b) CSS Stylesheets --> 

     <!-- Bootstrap --> 
    <link type="text/css" rel="stylesheet" href="bootstrap/css/bootstrap.min.css"> 

     <!-- Library --> 

    <link type="text/css" rel="stylesheet" href="library/font-awesome/css/font-awesome.min.css"> 
    <link type="text/css" rel="stylesheet" href="library/popup/popup.css"> 
    <link type="text/css" rel="stylesheet" href="library/owl-carousel/owl.carousel.css"> 
    <link type="text/css" rel="stylesheet" href="library/owl-carousel/owl.theme.css"> 


     <!-- STYLE Sheets --> 

    <link type="text/css" rel="stylesheet" href="css/style.css"> 
    <link type="text/css" rel="stylesheet" href="css/responsive.css"> 

    <!--(c) Javascript For Browser Support Issues --> 

    <script type="text/javascript" src="library/modernizr/modernizr.js"></script> 
    <!--[if lt IE 9]> 
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> 
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
    <![endif]-->  

    </head> 
<body> 

<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script> 
    <script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script> 
    <script type="text/javascript" src="library/jquery-easing/jquery.easing.min.js"></script> 
    <script type="text/javascript" src="library/easy-pie-charts/jquery.easypiechart.min.js"></script> 
    <script type="text/javascript" src="library/mixitup/jquery.mixitup.min.js"></script> 
    <script type="text/javascript" src="library/popup/jquery.popup.min.js"></script> 
    <script type="text/javascript" src="library/owl-carousel/owl.carousel.min.js"></script> 
    <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=true"></script> 
    <script type="text/javascript" src="library/gMap/jquery.gmap.min.js"></script> 
    <script type="text/javascript" src="js/script.js"></script> 
</body> 
</html> 

Когда я отладки это с помощью поджигатель я увидел, что тема шрифтов рендеринга из шрифтов API Google следующим образом в style.css файле

@import url(http://fonts.googleapis.com/css?family=Hind:300,500); 
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,400italic); 



#preloader { 
    position: fixed; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    background-color: #1a1b23; 
    z-index: 10000; 
} 

.loader { ... 

Так что я могу сделать здесь

+0

Проверили ли вы консоли? – PeeHaa

ответ

3

Я думаю, это может быть потому, что страница github использует HTTPS, но URL-адрес шрифта - HTTP.

Вы пытаетесь изменить URL-адрес, удалив http:, например, в this example?

+0

thnks это ошибка – kez

0

Вы можете использовать // для доступа к внешним URL-

@import url(//fonts.googleapis.com/css?family=Hind:300,500); 
@import url(//fonts.googleapis.com/css?family=Open+Sans:400,400italic) 
Смежные вопросы